From 2290dc2edf3fd66dc3c485082cca9a6fb3ea8cb0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=A5=E6=B5=A9?= <me@yanhao.ren>
Date: Wed, 9 Apr 2025 18:17:00 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=95=B0=E6=8D=AE=E5=8F=91?=
 =?UTF-8?q?=E9=80=81=E9=80=BB=E8=BE=91=EF=BC=8C=E7=A1=AE=E4=BF=9D=E4=BD=BF?=
 =?UTF-8?q?=E7=94=A8=E5=8E=9F=E5=A7=8B=E6=95=B0=E6=8D=AE=E5=AF=B9=E8=B1=A1?=
 =?UTF-8?q?=EF=BC=8C=E5=B9=B6=E5=A2=9E=E5=8A=A0=20props.data=20=E5=8F=98?=
 =?UTF-8?q?=E5=8C=96=E7=9A=84=E6=97=A5=E5=BF=97=E8=AE=B0=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../html-page/IframeConstellationDiagram.vue      |  4 +++-
 .../IframeConstellationDiagram.page.vue           | 15 +++++++++++++--
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/components/html-page/IframeConstellationDiagram.vue b/src/components/html-page/IframeConstellationDiagram.vue
index 23ce86b..b3d73f3 100644
--- a/src/components/html-page/IframeConstellationDiagram.vue
+++ b/src/components/html-page/IframeConstellationDiagram.vue
@@ -42,7 +42,8 @@ function sendDataToIframe(payload: Array<[number, number]>) {
   // 确保 iframe 存在、其 contentWindow 可访问且已发送初始化指令
   if (iframeRef.value?.contentWindow && isIframeInitialized.value) {
     console.log('Vue 组件：向 iframe 发送数据:', payload);
-    iframeRef.value.contentWindow.postMessage({ type: 'FEED_DATA', payload }, '*');
+    // 使用 toRaw 获取原始数据对象
+    iframeRef.value.contentWindow.postMessage({ type: 'FEED_DATA', payload: toRaw(payload) }, '*');
   } else {
     console.warn('Vue 组件：iframe 未初始化或数据无效，无法发送 FEED_DATA 消息。');
   }
@@ -52,6 +53,7 @@ function sendDataToIframe(payload: Array<[number, number]>) {
 watch(
   () => props.data,
   (newData) => {
+    console.log('Vue 组件：props.data 发生变化:', newData);
     // 确保新数据有效且 iframe 已初始化
     if (newData && newData.length > 0 && isIframeInitialized.value) {
       // 直接发送更新后的数据
diff --git a/src/pages/Page/iframe-page/IframeConstellationDiagram.page.vue b/src/pages/Page/iframe-page/IframeConstellationDiagram.page.vue
index 1c603ec..da08650 100644
--- a/src/pages/Page/iframe-page/IframeConstellationDiagram.page.vue
+++ b/src/pages/Page/iframe-page/IframeConstellationDiagram.page.vue
@@ -6,11 +6,22 @@ definePage({
   },
 });
 
-const data: Array<[number, number]> = [
+type ConstellationDiagramArr = Array<[number, number]>;
+
+const data = ref<ConstellationDiagramArr>([
   [0.20898877234451796, 0.8329353515647436],
   [-0.6589349632101078, 0.5886313023998213],
   [-0.5525702944049637, -0.7953057951401711],
-];
+]);
+
+setTimeout(() => {
+  // 测试数据更新
+  data.value.push(
+    [0.20898877234451796, 0.8329353515647436],
+    [-0.6589349632101078, 0.5886313023998213],
+    [-0.5525702944049637, -0.7953057951401711],
+  );
+}, 1000);
 </script>
 
 <template>