Advertisement

Vue 引入 bus 实现兄弟组件通信

阅读量：

1.简述内容概述

这是一篇介绍vue使用技巧的简要文章，内容主要聚焦于vue框架中兄弟组件之间信息传递的方法。在完成首个vue应用程序开发经历后，作者希望对相关经验进行整理与积累。此前在实际项目中，通常是通过引入bus的方式实现组件间的通信，对于此类常用工具，建议采取全局引入的方式并进行适当封装，以提升代码的可维护性与复用性。

2.局部使用案例

bus.js

复制代码 
    import Vue from 'vue'
    export const Bus = new  Vue();
    
    
    AI写代码javascript
    
    运行

获取总线通告

复制代码 
    import {Bus,NotifyRefresh} from "../../common/js/Bus";
    mounted() {
    	console.log('PageOne mounted')
    	Bus.$on(NotifyRefresh,(msg) =>{
       this.info = msg;
    });
    },
    
    
    AI写代码javascript
    
    运行

触发总线消息

复制代码 
    Bus.$emit(NotifyRefresh

全部评论 (0)

还没有任何评论哟~

相关文章推荐