iframe 子父传值，不跨域方法

 发送方

                window.parent.postMessage(
                    {
                        data: {
                            code: "success",
                            iframeHeight: height,
                        },
                    },
                    "*"
                );

接收方

mounted() {
    // 调用iframe中的方法
    window.addEventListener("message", this.handleMessage);
  },
  methods: {
    /**
     * 滚动事件触发下拉加载
     */
    handleMessage(event) {
      const data = event.data.data;
    },
}

这个方法必须是同一个作用域下面自己可以获取到父集的高度，这个如果不是同一作用域会跨域

            this.docTop = window.parent.document.documentElement.scrollTop
            this.docHeight = window.parent.document.documentElement.clientHeight

 有些不需要自己有滚动条，而是父集同一给一个大的滚动条，那就是子集自动撑开，这里需要计算自己给父集  self.docName是自己dom节点的id名称

iframe子集

// 通过方法计算iframe中的高度给父集，自动撑开
        getHeight() {
            let self = this
            let height = "";
            function onElementHeightChange(elm, callback) {
                let lastHeight = elm.scrollHeight;
                let newHeight = null;
                (function run() {
                    newHeight = elm.scrollHeight;
                    if (lastHeight != newHeight) callback(lastHeight);
                    lastHeight = newHeight;

                    if (elm.onElementHeightChangeTimer)
                        clearTimeout(elm.onElementHeightChangeTimer);
                    elm.onElementHeightChangeTimer = setTimeout(run, 300);
                })();
            }
            // 监听body高度变化
            onElementHeightChange(document.getElementById(self.docName), function (h) {
                if (document.getElementById(self.docName)) {
                    height = document.getElementById(self.docName).scrollHeight; //获取文本高度
                    window.addEventListener("message", submit()); // 向父页面传值
                }
            });
            function submit() {
                // 向父vue页面发送信息
                window.parent.postMessage(
                    {
                        data: {
                            code: "success",
                            iframeHeight: height,
                        },
                    },
                    "*"
                );
            }
            window.onload = function () {
                if (document.getElementById(self.docName)) {
                    height = document.getElementById(self.docName).scrollHeight;
                    window.addEventListener("message", submit());
                }
            };
        },

 调用iframe的父集

<template>
  <div id="dateSets">
    <iframe
      :src="this.dateSetUrl"
      frameborder="0"
      width="100%"
      scrolling="no"
      id="engineStudioDatasetIframe"
      :style="{ height: docHeight + 'px', 'min-height': 'calc(100vh - 330px)' }"
    ></iframe>
  </div>
</template>
<script>
export default {
  data() {
    return {
      dateSetUrl: process.env.VUE_APP_DATASET_LIST_URL,
      docHeight: 0,
    };
  },
  mounted() {
    // 调用iframe中的方法
    window.addEventListener("message", this.handleMessage);
  },
  methods: {
    /**
     * 滚动事件触发下拉加载
     */
    handleMessage(event) {
      const data = event.data.data;
      if (data) {
        this.docHeight = data.iframeHeight;
      }
    },
  },
};
</script>

<style scoped>
#dateSets {
  width: 100%;
  min-height: 700px;
  margin-top: 134px;
  background: #eee;
}
</style>