iframe 与父元素或子元素传递参数

iframe 向父窗口

window.parent.postMessage('向父窗口传的值',*);

 

父窗口向 iframe 内部子窗口传值

// 原生
<iframe src="iframeSrc" frameborder="0" width="100%" height="100%"></iframe>
documnet.querySelector('iframe').contentWindow.postMessage('向iframe传的值',*);

// vue
<iframe ref="h5CourseWare" :src="iframeSrc" frameborder="0" width="100%" height="100%"></iframe>
this.$refs.h5CourseWare.contentWindow.postMessage('向iframe传的值', '*')

 

接受信息

window.addEventList('message',  (e) => {
    console.log(e.data);
});

 

如果执行 e.data 不存在

window.addEventList('message',  (e) => {
  try{
    if (e.data type e.data ==='string' ) { 
      console.log(e.data); } }
catch (err) { console.log(err) } });

 

posted @ 2018-11-06 14:45  samirah  阅读(12850)  评论(0编辑  收藏  举报