mpvue中web-view怎么使用bindmessage?

Shiny
  • 194

如题,需求是h5页面传参给小程序接收,代码如下:

h5:

<template>
  <div>
    <button @click="postMessage">click</button>
  </div>
</template>

<script>
import wx from 'weixin-js-sdk'

export default {
  data () {
    return {
    }
  },

  methods: {
    postMessage () {
      const params = {
        wboid: 'data',
        wid: 'http://localhost:8080'
      }
      const data = JSON.stringify(params)
      wx.miniProgram.postMessage({ data })
    }
  }
}
</script>

小程序:

<template>
  <div>
    <web-view
      :src="url"
      @message="bindmessage"
    ></web-view>
  </div>
</template>

<script>
export default {
  data () {
    return {
      url: 'http://localhost:8081'
    }
  },

  methods: {
    bindmessage (e) {
      console.log(e)
    }
  }
}
</script>

h5的服务是localhost:8081,小程序是8080。
我在点击h5按钮的时候,小程序点击进入web-view的page直接就跳转到h5页面了,也没有打印任何信息,求解。

回复
阅读 1k
1 个回答
网页向小程序 postMessage 时,会在特定时机(小程序后退、组件销毁、分享)触发并收到消息。e.detail = { data },data是多次 postMessage 的参数组成的数组

image

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏