iframe嵌入并携带参数（父传子）

父组件

注：请注意传入参数的结构

<template>
    <div>
        <iframe
            ref="iframe"
            style="width: 80vw; height: 80vh"
            id="myiframe"
            @load="sendDataToIframe"  
            src="http://localhost:8080/#/eam/projectManagement"  
        ></iframe>
    </div>
</template>
<script>
export default {
   
 
    methods: {
        sendDataToIframe() {
            const iframe = this.$refs.iframe;
            if (iframe) {
                const iframeWindow = iframe.contentWindow;
                // 现在可以安全地使用iframeWindow对象了
                iframeWindow.postMessage({data："测试传入子组件的参数"}, "*");
            }
        },
    },
};
</script>

子组件

params.data就可以打印父组件传入的参数

 mounted() {
        window.addEventListener("message", (event) => {
            const params = event.data;
            // 处理接收到的数据
            console.log(params.data);
        });
}