js iframe传参

父级向iframe内部发送消息

// 获取iframe的引用
const mapFrame = this.$refs.iframeref;

// 处理浏览器兼容性
if (mapFrame.attachEvent) {
  // IE浏览器中使用attachEvent
  mapFrame.attachEvent('onload', function() {
    // 获取iframe内部的window对象
    const iframeWin = mapFrame.contentWindow;
    // 使用postMessage向iframe发送数据
    iframeWin.postMessage(data, '*');
  });
} else {
  // 其他浏览器使用onload事件
  mapFrame.onload = function() {
    const iframeWin = mapFrame.contentWindow;
    iframeWin.postMessage(data, '*');
  }
}

iframe内部接收消息

// iframe内部监听message事件，从父级接收数据
window.addEventListener('message', (event) => {
    // 获取从父级发送来的数据
    let form = event.data;
    // 对接收到的数据进行处理
    checkform(form);
}, false);

iframe内部向父级发送消息

// iframe内部使用postMessage向父级发送数据
window.parent.postMessage({
    abc: '123456',
}, '*');

父级接收iframe内部发送的消息

// 父级监听message事件，接收iframe内部发送的数据
window.addEventListener('message', (event) => {
  // 打印接收到的数据
  console.log(event.data);
}, false);