【转】解决iframe使用postMessage传值addEventListener未接收到却收到webpackwarning的问题

解决iframe使用postMessage传值addEventListener未接收到却收到webpackwarning的问题

 vue中元素嵌套iframe后绑在元素上的点击事件失效 

注意箭头函数

父页面组件 vue

      const oIframe = document.getElementById("bdIframe").contentWindow;
      let oIframeDom = document.getElementById("bdIframe");
      // 父页面向子页面传参
      let data = {
        form: "parent page",
        code: 200,
        data: "1",
        type: "view"
      };
      oIframeDom.onload = () => {
        console.log("parent onload");
        oIframe.postMessage(data, "*");
      };

 子页面

      console.log(' this.isIframe: ', this.isIframe)
      window.addEventListener('message', (event) => {
        //此处执行事件
        console.log('监听父页面向子页面的传参', event.data)
        let data = event.data
        if (data.type == 'view') {
          this.isIframe = true
        }
        console.log(' this.isIframe: ', this.isIframe)
      })

  

posted @ 2022-06-30 17:11  小小——开心  阅读(2009)  评论(0编辑  收藏  举报