iot-ui-app/pages/webview/index.vue

44 lines
1.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="webview-box">
<!-- <button style="z-index: 999;" @click="handlePostMessage('向url传值')">点击向url传值</button> -->
<web-view ref="webview" class="webview" :src="url" @onPostMessage="PostMessage" @message="PostMessage"></web-view>
</view>
</template>
<script>
export default {
data() {
return {
url:'http://192.168.18.103:8080/index?os=wx'
}
},
onLoad() {
this.url += '&t=' + new Date().getTime()
},
methods: {
// 接收h5页面发来的键值判断需要执行的操作
PostMessage(evt) {
console.log("postMessage1: ", evt)
},
// 获取到对应webview(关键)通过evalJs(注意大小写如果不知道evalJ是什么可自行百度) 执行网页的函数,可对其进行传参,完成与网页的通讯
handlePostMessage(res) {
console.log("22")
// this.$refs.webview.evalJs(`handleMessage(${res})`);
}
}
}
</script>
<style>
.webview-box {
position: absolute;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
}
.webview {
flex: 1;
height: 300rpx;
}
</style>