IframeMsg 通信使用
父子页面都需要应用
//main.js
import {IframeMsg} from 'w-iframe-msg'
app.config.globalProperties.$IframeMsg=IframeMsg;
父页面使用
//.vue html
<iframe ref="iframeElem" src="http://127.0.0.1:8082/xxchildren.html" frameborder="0"></iframe>
//父页面 传参到子页面并接收子页面返回的参数 xx.vue mounted
window.onload = () => {
var win=this.$refs.iframeElem.contentWindow;
this.$IframeMsg.targetOrigin=['http://127.0.0.1:8082'];//子页面的targetOrigin
//this.$IframeMsg.safety=false;//关闭安全模式 不用设置targetOrigin
this.$IframeMsg.postMessage(win, {test:'data'}).getMessage(function (e) {
console.log(e,'接收子页面参数')
})
}
子页面使用
this.$IframeMsg.targetOrigin=['http://127.0.0.1:8081'];//父页面的targetOrigin
//this.$IframeMsg.safety=false;//关闭安全模式 不用设置targetOrigin
this.$IframeMsg.getMessage(e=> {
console.log(e,'接收父页面参数')
this.$IframeMsg.postMessage(parent,'child1')
})