Vue组件通信

一、eventBus

1、使用条件：必须组件都存在的时候，必须都订阅了

2、需要新建一个untils包，下建一个bus.js文档

import Vue from "vue"
const bus = new Vue({})

export default bus

3、传参与收参

bus.$emit（‘事件名字’，参数）

bus.$on('事件名',(参数)=>{ })

二、ref

可以获取子组件（ui框架用）

<Home  ref='home'  />   this.$refs.home

div ref = 'div'    this.$refs.div

三、边界传参 this.$parent this.$children,this.$root

this.$parent  获取父组件的数据
this.$children  获取自组件的集合
this.$root      获取new Vue({}) 获取跟实例组件

四、mixins

混入组件
将组件的 公共部分进行提出，然后通过mixins混入的方式，加入到组件里面 
ps ： 不是响应式

mixin.js

export default {
    公共功能和公共数据
}

home.vue

mixins:[mixin,a,b,c]

五、provide inject 依赖注入

 祖先组件
 provide(){
     return {
         n:11,
         count:100
     }
 }
 
 后台组件里面
 inject:['n','count']
 
 响应式
  provide() {
    return {
      n: () => this.n, //传递函数形成必包
      count: 1,
    };
  },
  //自建
  inject: ["n", "count"],
  computed: {
    n1() {  n1是要使用的值
      return this.n();
    },
  },

 六、原型链

Vue.prototype.$axios = axios;
Vue.prototype.$jquery = Jquery

// 一般会放在原型