公司小程序场景中需要用到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) {
wx.showToast({
title: "转发成功",
icon: 'success',
duration: 2000
})
},
fail: function (res) {
}
}
},
methods: {
bindmessage(e){
console.log(e)
}
},
}
</script>
<style scoped>
</style>
