uniapp的web-view嵌入网页,网页与uniapp通信

uniapp端:

<template>  
    <view>  
        <web-view src="http://192.168.0.112:8090/tt/" @message="handleMessage"></web-view>  
    </view>  
</template>  

<script>  
    export default {  
        methods: {  
            handleMessage(evt) {  
                console.log('接收到的消息:' + JSON.stringify(evt.detail.data));  
            }
        }  
    }  
</script>

html网页端:

<script type="text/javascript" src="uni.webview.1.5.3.js"></script>
<script>
document.addEventListener('UniAppJSBridgeReady', function() {  
	 uni.postMessage({  
        data: {  
             id: 1,
        name:'nihao',
        }  
    }); 
});
</script>

 

uni.webview.1.5.3.js的下载地址:https://gitee.com/dcloud/uni-app

 

参考:

web-view | uni-app官网 (dcloud.net.cn)

在web-view加载的本地及远程HTML中调用uni的API及网页和vue页面通讯 - DCloud问答

posted @ 2022-06-09 17:53  盛世芳华  阅读(2038)  评论(1编辑  收藏  举报