做企业网站应该注意什么,自助建站cn,苏州平面设计公司前十名,广告设计与制作专业描述一、window.onmessage window.onmessage 是一个属性#xff0c;直接赋值为事件处理函数。当使用这个方式时#xff0c;只能绑定一个事件处理函数#xff0c;如果后续再次赋值#xff0c;会覆盖之前的处理函数。如果在同一个页面中只有一个地方需要处理消息#xff0c;这种…一、window.onmessage window.onmessage 是一个属性直接赋值为事件处理函数。当使用这个方式时只能绑定一个事件处理函数如果后续再次赋值会覆盖之前的处理函数。如果在同一个页面中只有一个地方需要处理消息这种方式可能是足够的. window.onmessage是HTML5的方法用来解决跨页面通信或者通过 iframe嵌套的不同页面的通信问题。postMessage为发送方onmessage为接收方
window.onmessage function (event) {console.log(event)
}需要注意的是window.onmessage需要在 iframe 加载完成后才能正常工作。你可以将其放在window.onload事件中以确保在 iframe 加载完成后再执行监听器 二、window.addEventListener window.addEventListener(‘message’, function, useCapture) 2.1、useCapture参数是一个可选的布尔值表示事件是否在捕获阶段处理。如果该参数为true则事件在捕获阶段执行回调函数如果为false或省略该参数则事件在冒泡阶段执行回调函数 2.2、addEventListener 方法允许你添加多个事件处理函数而不是覆盖现有的处理函数。这在多个组件或模块需要处理消息时非常有用。 2.3、这种方式更加灵活因为你可以添加多个监听器而不会相互干扰
window.addEventListener(message, function(event) {console.log(event, -------)
}, false)三、说明 我遇到的情况是micro-app开启微前端的情况下iframe监听接收数据使用window.onmessage无法监听到信息换成addEventListener的方式就可以监听到考虑到是window.onmessage在 iframe 加载完成前就已经被调用而window.addEventListener则是在加载完成后才执行的所以是否window.onmessage在onload之后执行就能成功此方法未验证目前使用window.addEventListener监听能够正常使用