vue 中使用iframe内嵌页面并通信

场景：在内嵌的webform页面中，点击了保存按钮，执行逻辑后 需要把 外层vue的 dialog 关闭，也就是调用vue的关闭窗口方法

1：老页面点击

cs后台代码 调用js
//vue 内嵌的话
RegisterClientScriptBlock(“”, “<script type=“text/javascript” language=“javascript”>closevue();”);

js页面向vue传递信息postMessage
function closevue() {
alert(“保存成功，即将关闭页面”)
//iframe向vue传递信息
window.parent.postMessage({
cmd: ‘myIframe’,
params: {
info: ‘iframe向Vue传递的消息’,
}
}, ‘*’);

}

vue:
监听消息 获取信息后调用 close方法 进行关闭窗体Visible
mounted() {
window.addEventListener(‘message’,this.getiframeMsg)
},
methods: {
close () {
this.value = { Utl: ‘’, Title: ‘’, Visible: false };
},
// vue获取iframe传递过来的信息
getiframeMsg(event){
const res = event.data;
//console.log(event)
if(res.cmd == ‘myIframe’){
this.close();
}
},
}