Javascript MessageChannel上出错：“未找到与提供的签名匹配的函数”

当我使用MessageChannel和trigger sendMsg事件时，我得到错误：TypeError:未能在“MessagePort”上执行“postMessage”：未找到与提供的签名匹配的函数

我对此知之甚少，有人能给我一些建议吗

a、 vue

b、 vue

c、 vue

---

与Window.postMessage不同，它没有origin参数，因为只有一个与此MessageChannel相对应的、您已经信任的对象

因此，在port.postmessagesg中，*实际上是作为应该是transferList的内容传递的，但事实并非如此，因此出现了错误

const channel=新消息通道； channel.port1.postMessage'foo'，'*'；//投掷

<template>
  <div class="block">
    <iframe src="/messaging/channel-messaging/b" />
    <iframe src="/messaging/channel-messaging/c" />
  </div>
</template>

<script>
export default {
  mounted() {
    window.addEventListener('message', e => {
      if (e.ports.length !== 0) {
        window.frames[1].postMessage('initPort', '*', e.ports)
      }
    })
  }
}
</script>

<template>
  <div class="block">
    <p>
      <input type="text" v-model="msg">
      <button @click="sendMsg">send</button>
    </p>
    <p>c say：{{ receiveMsg || 'nothing' }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      msg: '',
      receiveMsg: '',
      port: ''
    }
  },
  mounted() {
    const mc = new MessageChannel()
    this.port = mc.port2
    window.parent.postMessage('B has loaded', '*', [mc.port1])
    mc.port2.onmessage = e => {
      this.receiveMsg = e.data
    }
  },
  methods: {
    sendMsg() {
      if (this.port) {
        this.port.postMessage(this.msg, '*')
      }
    }
  }
}
</script>

<template>
  <div class="block">
    <p>
      <input type="text" v-model="msg">
      <button @click="sendMsg">send</button>
    </p>
    <p>b say：{{ receiveMsg || 'nothing' }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      msg: '',
      receiveMsg: '',
      port: ''
    }
  },
  mounted() {
    window.parent.postMessage('C has loaded', '*')
    window.addEventListener('message', e => {
      if (e.data === 'initPort') {
        this.port = e.ports[0]
        this.port.onmessage = e => {
          this.receiveMsg = e.data
        }
      }
    })
  },
  methods: {
    sendMsg() {
      if (this.port) {
        this.port.postMessage(this.msg, '*')
      }
    }
  }
}
</script>