import {getCurrentInstance} from 'vue' const instance = getCurrentInstance() // emit为自定义的发布事件,由于配置过类型提示,会出现 all | emit | on | clear // emit接受第一个参数为事件名(自定义),第二个参数为传递的值 const emit = () => { instance?.proxy?.emitter.emit('mitt-foo','...
我们可以在创建bus.ts的时候,通过自定义一个bus对象,来挂载mitt的 API 。 在bus.ts里,改成以下代码: importmittfrom'mitt';// 初始化一个 mitt 实例constemitter=mitt();// 定义一个空对象用来承载我们的自定义方法constbus:any={};// 把你要用到的方法添加到 bus 对象上bus.$on=emitter.on;bus.$emit...
所以,我来了 轻便小巧的EventBus来了,代码如下 ↓ JS版 TS版 使用方法 总结 可以看到,API的使用与之前一致。 最后作者想说,此方法并不与某一个框架强绑定,可以自由使用在任意项目环境中!!! 全文系博主原创,转载请标明出处. __EOF__ 本文作者: 微若蜉蝣 本文链接: https://www.cnblogs.com/fuyouplus/...
import { ref, reactive, watch } from 'vue' const count = ref(0) const user = reactive({ name:'chengang', age: 28 }) // 监听基本数据类型 watch(() => count, (newval, oldval) => { console.log(newval, oldval) }) watch(() => count.value, (newval, oldval) => { consol...
40 changes: 40 additions & 0 deletions 40 src/utils/eventBus.ts @@ -0,0 +1,40 @@ type EventType = string | symbol;type Handler<T = unknown> = (event: T) => void;function eventBus() { const all = new Map(); return { on(type: EventType, handler: Handler) {...
TS版 const eventStack: any = {}; const $on = (eventName: string, callBack: (value: any) => void): void => { if (eventStack[eventName]) { eventStack[eventName].callBacks.push(callBack); callBack(eventStack[eventName].value); ...
在2.x,使用 EventBus 无需导入第三方插件,直接在自己的libs文件夹下创建一个bus.ts文件,暴露一个新的 Vue 实例即可。 import Vue from 'vue'; export default new Vue; 然后就可以在组件里引入 bus ,通过$emit去发起交流,通过$on去监听接收交流。