w-iframe-msg
TypeScript icon, indicating that this package has built-in type declarations

1.0.4 • Public • Published

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')
})

Readme

Keywords

none

Package Sidebar

Install

npm i w-iframe-msg

Weekly Downloads

0

Version

1.0.4

License

ISC

Unpacked Size

3.71 kB

Total Files

5

Last publish

Collaborators

  • conboho