记关于vue页面与iframe互相传参

vue向iframe传参：

const mapFrame = this.$refs["mainIframe"];

let that = this; // 划重点
if (mapFrame.attachEvent) {
    // 兼容浏览器判断
    mapFrame.attachEvent("onload", function () {
        mapFrame.contentWindow.postMessage(
            { a: 777 },
            "*"
        );
        // data传递的参数   *写成子页面的域名或者是ip
    });
} else {
    mapFrame.onload = function () {
        mapFrame.contentWindow.postMessage(
            that.dataList,
            "*"
        );
    };
}

iframe向vue传参：

window.parent.postMessage({ a: 888 }, "*");

// 如果js外还有js  那就重复包
// window.parent.window.parent.postMessage({ a: 888 }, "*");

 接收数据：

// 获取并监听传递来的数据
window.addEventListener("message", function (messageEvent) {
    var data = messageEvent.data;
    // console.log(data, "iframe传递过来的数据");
    // console.log('收到vue的数据：', data);
});

 ps：关于vue向iframe传数组

找了很多资料都说postMessage不能传数组  什么队列化  要转换成对象过去  比如{a: [1,2,3,4}

后来发现只是onload里this指向有问题。。