iframe页面向vue父页面传值,vue页面向iframe页面传值
1.iframe页面向vue父页面传值vue代码<template><div><iframe id="iframe"></iframe></div></template><script>export default {data(){return {iframeDa...
·
1.iframe页面向vue父页面传值
vue代码
<template>
<div>
<iframe id="iframe"></iframe>
</div>
</template>
<script>
export default {
data(){
return {
iframeData: null
}
},
mounted(){
let that = this;
window.addEventListener("message", function(e) {
that.iframeData = e.data
});
}
}
</script>
iframe代码
<script>
let message = 1;
window.parent.postMessage(message,"*");
</script>
2.vue页面向iframe页面传值
vue代码
<template>
<div>
<iframe id="iframe" ref="iframe"></iframe>
</div>
</template>
<script>
export default {
mounted(){
this.iframe = this.$refs.iframe
this.iframeWindow = this.iframe.contentWindow
let message = 1
this.iframeWindow.postMessage(message, '*')
}
}
</script>
iframe代码
<script>
window.addEventListener('message', function (e) {
console.log(e.data)
}
</script>
更多推荐
已为社区贡献4条内容
所有评论(0)