如何使用将Vue 2 $on,$emit事件总线迁移到Vue 3?

55ooxyrt  于 2023-01-21  发布在  Vue.js
关注(0)|答案(1)|浏览(170)

如何将VueJS v2代码转换为v3?

window.Eventing = new (class {
    constructor() {
        this.vue = new Vue();
    }
    fire(event, data = null, subdata = null) {
        this.vue.$emit(event, data, subdata);
    }
    listen(event, callback) {
        this.vue.$on(event, callback);
    }
})();
66bbxpm5

66bbxpm51#

Vue 3不再支持其原型中的事件发射API(包括$emit$on),但您可以切换到不同的事件发射器库,例如tinyemitter(适合CDN使用)或tiny-emitter,其API与Vue 2中的原始API非常接近:

import TinyEmitter from 'tinyemitter'

window.Eventing = new (class {
    constructor() {
        this.emitter = new TinyEmitter();
    }
    fire(event, data = null, subdata = null) {
        this.emitter.emit(event, data, subdata);
    }
    listen(event, callback) {
        this.emitter.on(event, callback);
    }
})();

demo

相关问题