uniapp开发app，webview与app相互通信

一、app向webview发送数据（传参），在index.vue页面

1、通过url传参

<view class="html-box">
    <web-view :src="'../../../hybrid/html/viewContract/index.html?data=' + obj" @message="getMessage" ref="wv"></web-view>
</view>


2、通过evalJS("uniEvent(`${params}`)")
data() {
    return {
        currentWebview: null,
        obj: null
    }    
},
onLoad() {
    const self = this;
    self.currentWebview = self.$scope.$getAppWebview().children()[0]

    //传递大量数据
    self.currentWebview.evalJS(`getParams(${JSON.stringify(res)})`)
},
methods: {
    saveContract() {//app通过事件向html发送数据
        const self = this;
        self.currentWebview.evalJS("uniEvent('saveContract')");    
    },
}

二、webview接收app发来的数据（传参），在/hybrid/html/viewContract/index.html页面

1、通过url接收参数
<script type="text/javascript">
    console.log('接收url参数', decodeURIComponent(location.href.split('data=')[1]))
</script>


2、通过evalJS定义的方法接收参数
<script type="text/javascript">
    let dianziHetong = null;
    window.getParams = (data) => {
          console.log("webview内部：", data)
          dianziHetong = data
          console.log(dianziHetong)
    }
    window.uniEvent = function(data) {
        console.log('app发来的数据', data)
    }
</script>

三、webview向app发送数据（传参），在/hybrid/html/viewContract/index.html页面

1、通过uni.postMessage()
<script src="../js/uni-webview.js"></script>
<script type="text/javascript">
    document.addEventListener('UniAppJSBridgeReady', function() {
        uni.postMessage({
            data: {
                msg: 'saveContract',
                content: editor.txt.html()
            }
        });
    })
</script>

四、app接收webview发来的数据（传参），在index.vue页面

1、通过绑定事件getMessage获取
getMessage(e) {
  console.log('接收webview发来的数据', e.detail)
},