微信小程序 mpvue，webview中h5页面向小程序发送数据bindmessage方法 - 好文

公司小程序场景中需要用到webview中的bindmessage方法，因为不好好看文档，弄了好长时间，心碎，所以在这里给自己加深一下印象，要好好看文档。
方法的话，微信小程序原生写法和mpvue方法类似，在这里仅以mpvue为例，以转发为条件触发bindmessage事件

注意点

* 网页向小程序 postMessage 时，会在特定时机（小程序后退、组件销毁、分享）触发并收到消息。一定看清楚是小程序后退、组件销毁、分享
时才会触发，我没看清弄了好长时间，蓝瘦香菇……
感觉这个方法有点坑，请慎用……，特定时机（小程序后退、组件销毁、分享）触发

小程序
template <web-view :src="url" @message="bindmessage"></web-view> script
bindmessage(e){ console.log(e) }
h5页面
html 引入js sdk  <script type="text/javascript" src=
"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
script 向小程序传值的方法
// javascript wx.miniProgram.postMessage({ data: 'foo' }) wx
.miniProgram.postMessage({data: {foo: 'bar'} })
所有代码以转发为条件触发bindmessage事件
<template> <div> <web-view :src="url" @message="bindmessage"></web-view> </div>
</template> <script> import store from '@/pages/counter/store' export default {
data () {return { url:'' } }, store, onShareAppMessage(options) { return {
title:'title', path: this.url, success: function (res) { // that.web_url =
return_url // 转发成功 wx.showToast({ title: "转发成功", icon: 'success', duration: 2000
}) }, fail:function (res) { // 转发失败 } } }, methods: { bindmessage(e){
console.log(e) } }, }</script> <style scoped> </style>

热门工具换一换