使用postMessage通信，未触发message事件

前提：

父子页面跨域通信，使用postMessage技术

a页面为父页面，b页面为子页面

a中包含多个iframe,部分域名是相同的，目录层级不一致，地址使用变量根据触发的条件不同拼接地址

部分代码（使用vue）：a页面

<iframe src="www.baidu.com/1/2/3.html"></iframe>

<iframe src="www.baidu.com/4/5.html"></iframe>

考虑地址部分重复用变量来封装下,页面代码写成了如下

<iframe :src="`www.baicu.com/${address}`"></iframe>

 

问题：

iframe如果地址不确定，无法调取window.addEventListener('message', function(){})

中的message事件。

（排错的过程不赘述，每个人的方法不同，但这是最重要的能力，你可以技术能力一般点，但一定要有快速定位问题的能力，扯远了回来）

 

解决：

乖乖的写两个地址，这样用v-show(v-if)去隐藏另一个iframe