postMessage页面间消息传递

1.消息发送

let routeData = this.$router.resolve({ path: '/web-view', });
const targetwindow = window.open(routeData.href, '_blank');
let message = { name: 'iframe', url: url }
setTimeout(() => {
    targetwindow.postMessage(JSON.stringify(message), '/')
}, 1000);

2.页面消息接收

created () {
  window.addEventListener('message', this.onMessageChange)
},

// 监听变化
onMessageChange (e) {
   let data = e.data
   if (data) {
        let info = {}
        try {
          info = JSON.parse(data)
        } catch (error) {
          info = data
        }
        if (info && info.name == 'iframe') {
          this.url = info.url
        }
   }
}

 beforeDestroy () { // 在组件生命周期结束的时候销毁。
    window.removeEventListener('message', this.onMessageChange)
  },