vue 3.0 总线程bus引入(mitt)
vue 3.0 移除了 $on
,$off
和 $once
方法,$emit
仍然是现有 API 的一部分,因为它用于触发由父组件以声明方式附加的事件处理程序.
官方推荐使用第三方类库。 mitt举例:
1、执行 npm install --save mitt 加载依赖
2、创建bus.js 文件内容如下:(可与main.js同级)
import mitt from 'mitt'
const bus = {}
const emitter = mitt()
bus.$on = emitter.on
bus.$off = emitter.off
bus.$emit = emitter.emit
export default bus
3、main.js 加入内容如下:
import Bus from './bus.js'/// mitt 总线程引入
Vue.prototype.bus = Bus;
4、使用如下:
兄组件:
methods: {
workOrdChange(val) {
let self = this;
self.bus.$emit('dr-workOrd-change', val)
}
}
弟组件:
created() {
let self = this;
self.bus.$on("dr-workOrd-change", (val) => {
let drO = val;
console.log("drO in" + drO);
});
},
完毕!