关于uniapp webview页面与小程序之间传值

最近项目有遇到 小程序内嵌套webview的场景，整站嵌套的，这样就避免不了H5和小程序之间通信，小程序用的uniapp写的，H5是用vue写的，

首先在H5页面引入微信的JS

然后再引入uniapp 的JS

然后在H5页面 因为我的H5是用VUE写的 所以这段代码要放在VUE的mounted钩子函数里执行

  document.addEventListener('UniAppJSBridgeReady', function() {
       uni.postMessage({
            data: {
                options:'来自H5的问候'
            }
        });
        uni.getEnv(function(res) {
            console.log('当前环境：' + JSON.stringify(res));
        });
    });

 uni.postMessage({
            data: {
                 options:'来自H5的问候'
            }
        });

这个就是H5页面向uniapp页面传值的方法 要传的值一定要写到data里面！！！！！；

这样H5 就布置完了 主要是uniapp 端取值

先附上uniapp webview的文档 https://uniapp.dcloud.io/component/web-view

如文档所说的 在webview标签上绑定 @message,来获取H5传来的值

			getMessage(e) {
            console.log(e)
            let data = e.detail.data
		 },

这样还不行！！！！ 

因为绑定的方法getMessage只有在特定情况下才被会调用

 分享不适合我现在的需求  销毁。。没试，我是在后退这个时机调用取值的

首先把webview页面复制一份，一毛一样的，第一个webview 标签上不绑定message，在复制的webview页面绑定message 取值

第一个webview

复制的webview

然后在第一个webview页面里让页面一加载完就跳到复制的webview页面，额。。要加个判断条件 不然两个页面一直互跳...

//主webview



 

然后进入复制的webview

这样从第一个webview跳过来后 再使用navigateback就达到@message的调用条件了 其他细节就不说了

这样就可以通过getMessage方法来获取H5   传来的值了，

uniapp 给H5传值更简单  只要在webview的src地址上拼接就行了