Vue公交车-Bus，父子传值，子子传值，子父传值

十年河东，十年河西，莫欺少年穷

学无止境，精益求精

传统方式：

1.父组件可以使用 props 把数据传给子组件。

1.子组件可以使用 $emit 触发父组件的自定义事件。

公交车方式：

Vue公交车-Bus，父子传值，子子传值，子父传值，功能非常强悍。

1、引入公交车

npm install vue-bus

2、main.js 中全局注册公交车

import Vue from 'vue'
import App from './App'
import router from './router'
import Antd from 'ant-design-vue';/* 全局引入ant */
import 'ant-design-vue/dist/antd.css'; /* 全局引入ant样式文件*/
import VueBus from 'vue-bus';  /* 全局引入vue公交车 用于子子组件传值*/

import components from './components/componentsRegist.js'  /* 全局引入组件注册JS*/

import axios from './utils/request';

Vue.config.productionTip = false
Vue.use(Antd); /* 使用antd */

Vue.prototype.$axios = axios /* axios */
Vue.use(components);  /* 使用自定义组件 */
Vue.use(VueBus); /* 公交车 */

new Vue({ el: '#app', router, components: { App }, template: '' })

新建 一个vue页面，点击按钮，执行公交车通知事件，如下

页面二接收公交车的通知事件，如下

页面三接收公交车事件，如下

执行结果【必须先点击页面二和页面三，用于初始化created钩子函数，否则，是收不到通知事件的】：

 @天才卧龙的博客