1.父给子传值:经过一个点击事件,给子页面传值,显示不同的模型
父页面代码:
<iframe :src='iframeShowUrl.showURL' :height="iframeShowUrl.domHeight" id="iframe_container" width="100%"/>
事件:
onclick(row, column, event){ var iframe = document.getElementById('iframe_container'); var json = { type:1, num:parseInt(row.num), }; iframe.contentWindow.postMessage(JSON.stringify(json),'*'); },
子页面代码:
window.addEventListener('message', function (e) {
var data = JSON.parse(e.data);//转化为json
type= parseInt(data.type)
num = parseInt(data.num)
//防止异常
try {
if (type== 1) {
if(num == 0){ 自己业务......
}else{ 自己业务......
}
}else if(type== 2){
if(num == 0){ 自己业务......
}else{ 自己业务......
}
}
}
catch (err) {
}
}, false);
2,子页面给父页面传值:经过点击事件传值
子页面代码:
function NameSendTest(SensorName) {
var json = {
func_type :"moni_draw"
data:SensorName
}
window.parent.postMessage(JS0N.stringify(json),'*');
}
父页面代码:需要监听
mounted() { window.addEventListener("message",this.onMessagessss); },
methods:{ this.onMessagessss(e){ var data = JSON.parse(e.data);//转化为json console.log(data ) 做自己业务.... } }
点击F12,可以看到输出的值如下