时间戳

首页 > 解决方案 > Corvid 页面代码和 HTML 元素之间的消息传递，获取 [object Object] 而不是实际消息，如何更正我的代码？

javascript - Corvid 页面代码和 HTML 元素之间的消息传递，获取 [object Object] 而不是实际消息，如何更正我的代码？

问题描述

我正在尝试使用 Wix 的 Corvid 了解页面代码和 HTML 元素之间的消息传递。

我在页面上有以下 2 项：

我在 HTML 元素“代码”部分中有一个代码，它等待页面加载，然后向页面发送一条消息（“来自 iFrame 的消息”），然后等待来自页面的答案。得到答案后，显示答案：

<html>
  <head>
    <script>
    window.addEventListener('load', function() {
        window.parent.postMessage("Message from iFrame", "*");
        window.onmessage = (event) => {
            if (event.data) {
                document.getElementById("theLabel").innerHTML = event.data;
            }
        };
    })
    </script>
  </head>
  <body>
      <span id="theLabel" class="label">HTML Label</span>
  </body>
</html>

页面代码等待来自 HTML 元素的第一条消息，然后向它发送答案。

$w.onReady(function () {
 // TODO: write yor page related code here...
    $w("#html4").onMessage( (event) => {
        let receivedData = event.data;
        $w('#text32').text = receivedData;
        $w("#html4").postMessage("answer from Corvid");
    } );
});

在页面上，文本元素在上面，HTML 元素在下面。所以我期待看到：

-来自 iFrame 的消息

- 来自科维德的回答

但相反，我看到了这个：

-来自 iFrame 的消息

-[对象对象]

然后几秒钟后，“[object Object]”在几毫秒内变为“来自 Corvid 的答案”，然后再次变为“[object Object]”。

我想要做的是正确地传达实际信息。

标签： javascripthtmlvelo

解决方案

推荐阅读