vue3使用bus

318 阅读1分钟

vue3使用bus

通常在开发中会使用实时触发,bus就可以帮我们实现。

1.安装mitt
npm install --save mitt

2.创建bus.ts文件

import mitt from 'mitt';
export default mitt();

3.在需要使用的地方引入bus.ts文件,按需引用

import bus from '/@/utils/bus';

触发方:

let params={
    name:'张三'
}
bus.emit('test', params);
// test为触发标识,params为传参

接收方:

// test为触发标识,msg为接参
onMounted(() => {
    bus.on('test', function (msg) {
        console.log('bus接收', msg);
    });
});
// {name:'张三'}

//离开页面解绑bus
onUnmounted(() => {
    bus.off('test');
});

注:触发放和接收方都需要引入bus.ts文件