亚洲av无码乱码国产一区二区,午夜理论片yy44880影院,午夜久久久久久禁播电影,熟睡人妻被讨厌的公侵犯

02
2024/08

vue3中的全局事件總線

發(fā)布時(shí)間:2024-08-02 16:25:59
發(fā)布者:dzw
瀏覽量:
0

        我們之前講過一期組件通信,其中有一個(gè)vue2的全局事件總線,通過在Vue原型對象身上創(chuàng)建一個(gè)名為Bus的方法,因?yàn)閂ue的原型對象的屬性的方法都可以被Vue實(shí)例對象和VC組件實(shí)例對象訪問得到,所以通過全局事件總線,兄弟組件之間也能傳值。

        而vue3沒有了全局事件總線,$on和$emit無法使用了,如果想要使用全局事件總線就需要借助第三方插件。

        這里我們呢使用mitt這個(gè)插件。

    //npm    
    npm install mitt -s
    //yarn
    yarn add mitt

        通過以上代碼可以下載mitt。然后我們可以封裝mitt為一個(gè)單獨(dú)的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

        然后在main.js內(nèi)引用該文件

    import Bus from ‘./utils/myBus’


        import導(dǎo)入后,通過app.fig.globalProperties就能把他變成全局事件,$EventBus可以自定義名字,不重要

    app.config.globalProperties.$EventBus = Bus


        然后就可正常使用了。使用方法可以參考上一期,需要注意,因?yàn)関ue3沒有this了,我們直接寫就可以,根據(jù)import引入的名字來調(diào)用。

image

    


關(guān)鍵詞:
返回列表