• Vue2不使用Vuex如何实现兄弟组件间的通信


    在一些正规的大型项目的企业级开发过程中我们一般会引入Vuex来对Vue所有组件进行状态管理,可以轻松实现各组件间的通信。但是有时候做做自己的小项目,没有必要使用Vuex时,如何简单的实现组件间的通信?父组件与子组件间就不说了,关于兄弟组件间通信,这里有个简单方法。

    1.新建bus.js,new一个Vue实例:

    import Vue from 'vue';
    export default new Vue;
    

    2.需要通信的组件都引入该bus.js

    import Bus from '@/util/bus';
    

    3.调用Bus的触发事件和监听事件实现通信

    Bus.$emit('changeIndex', index);
    
    Bus.$on('changeIndex', (index) => {
      this.navIndex = index;
    });
    

    这里的bus.js可以理解为是公共汽车,这个bus的作用就是行驶在各个组件之间从而实现组件间通信、参数传递,写起来也比较方便,这种实现方式Vue官网也有介绍,可以通过单独的事件中心管理组件间的通信:eventHub

  • 相关阅读:
    new、delete和malloc、free
    重写与重载
    面向对象三个基本特征
    Js零散知识点笔记
    ES6 笔记
    js 单例模式笔记
    关于闭包的见解
    DOM笔记
    浏览器差异
    JS高级程序设计 笔记
  • 原文地址:https://www.cnblogs.com/kaidarwang/p/9186470.html
Copyright © 2020-2023  润新知