使用web-view实现小程序与web页面通信

最近在使用mpvue做小程序的时候，需要实现web端与小程序端通信，所以选择web-view来进行实现

在小程序中使用web-view

<web-view src="http://xxxxxx" @message="getMessage"></web-view>

在web端使用时，先要引入微信JSSDK，微信开发者社区下载即可，此处项目使用vue开发
此处在使用时遇到了一个问题，开始时是使用import 在.vue文件中引入，但是编译之后报错

导致web端和小程序中页面一片空白
于是选择在vue的index.html中引入

<script type="text/javascript">
  define = null
  require = null
</script>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>

这里如果使用了eslint，可能会有红色波浪线提示，可以不用管，在.vue中使用JSSDK接口时，提示wx没有定义，此处可以在.eslintignore文件中将使用wx的.vue文件进行忽略

wx.miniProgram.postMessage({ data: {part: data.title}})

由于只有在小程序页面销毁，后退或者分享时才会发送数据，所以可以配合JSSDK提供的其他接口来配合使用，详细接口请参考微信开发者文档

微信开发者文档

参考博客：https://blog.csdn.net/qq_42363090/article/details/101282095