标签页通信

BroadcastChannel
 

封装：
 

//创建频道
const channel = new BroadcastChannel('chat');

//发送消息
export function send(type: any, msg: any) {
    //发送信息
    channel.postMessage({
        type:type,
        msg:msg
    });
}


//接收消息
export function getMsg(callback: any) {
    //收到信息
    channel.addEventListener('message', (event) => {
        callback && callback(event.data);
    })
}

使用：
父：

编辑页：

 

注意点：标签页通信需要两个页面同时都存在的时候才能进行当只有一个的时候就会导致数据无法发送

解决方法：

编辑页

父

 

注意：传递的数据只能是普通的数据结构，不能使用代理数据，因此要使用toRaw对数据进行转换