vue 嵌套iframe並進行傳值

vue中引入iframe

<template>
    <div>
        <iframe src="鏈接" ref="iframe"></iframe>
    </div>
</template>

父級vue中：

<script>
    export default {
        data: {
            iframeVue: null
        },
　　　　　mounted(){
　　　　　　　　window.addEventListener('message', this.handleMessage) // 監聽iframe的事件
　　　　　　　　this.iframeVue= this.$refs.iframe.contentWindow
　　　　　},
　　　　　methods: {
　　　　　　　handleMessage(event) {
　　　　　　　　let data = event.data
　　　　　　},
　　　　　　sendMessage() {
            // 向iframe傳參
            this.iframeWin.postMessage({
　　　　　　　　　　iframeClick: 'getParams',     //  iframe對應用來判斷觸發的是什麼事件
　　　　　　　　　　params: {                 // 傳過去的值
　　　　　　　　　　　　key: this.params,   
  　　　　　　　　　　}
　　　　　　　　　　}, '*')
　　　　　　}
　　　　　} 
}

iframe中：

<script>
　　export default {
　　　　data: {
　　　　　　iframeVal: null ,    // 爲了接受vue傳過來的值
　　　　},
　　　　mounted() {
　　　　　　// 接受vue傳過來的值
　　　　　　window.addEventListener('message', (event) => {
  　　　　　　console.log(event)
  　　　　　　let data = event.data;
  　　　　　　switch (data.iframeClick) {
    　　　　　　case 'getParams':
      　　　　　this.iframeVal= data.params.key;   // 這樣就拿到了vue傳過來的params
  　　　　　　}
　　　　　　})
　　　　}
　　}
</script>```