两个项目之间通信，核心的方法是传值 ：postMessage() 和 接收值 ：addEventListener()

1.地址栏传参方式

<template>
	 <iframe ref="iframeRef" :src="gameurl" id="iframe" frameborder="0" style="width: 100%; height: 100%"
        class="game_iframe"></iframe>
</template>
<script  setup>
onMounted(() => {
 	let iframeDom = document.getElementById("iframe");
   let url = iframeDom.src + "?id=1&name=糖豆豆&age=18&gender=男"; //拼接上需要传递的参数
   document.getElementById("iframe").src = url;
});
</script>

2.postMessage传参方式

<template>
	 <iframe ref="iframeRef" :src="gameurl" id="iframe" frameborder="0" style="width: 100%; height: 100%"
        class="game_iframe"></iframe>
</template>
<script  setup>
import { ref, onMounted, onUnmounted, nextTick, toRaw, toRef, reactive } from "vue";
let iframeRef = ref(null);
onMounted(async() => {
 	 await nextTick()
 	 window.addEventListener("message", playEvent); //监听对方发过来的数据
});
const playEvent = (e) => {
  // console.log(e.data, "iframe传递过来的值*");
  iframeRef.value.contentWindow.postMessage({ type: "msgData", data: { name: '首次发送消息'}}, "*") //进入这个页面就给对方iframe传参过去
  if (e.data.type === "Test") {  //根据对方传过来的类型 给他返回想要的数据

    if (iframeRef.value && iframeRef.value.contentWindow) {
      let data=toRaw(msgData.value)  //将响应式数据转为普通  否则发送不了
      iframeRef.value.contentWindow.postMessage(data, "*")
      console.log('发过去拉');
    }
  }
}
</script >