vue provide 和 inject (依赖注入)的使用

当我们嵌套组件层级过多时,使用注入依赖可以更方便的实现传值: 例如一个组件给他的孙子级组件传值:

1.传递一个数据时:

首先祖先组件使用provide传输:
  provide() {
    return {
      infos: this.info   //infos是自己取的名字
    }
  },
  然后后代组件使用reject接收:
   inject:['infos']    //inject和provide在组件中都是与created平级.

2.传递一个方法:

先在祖先组件定义一个方法;
 provide() {
    return {
      fun: this.fun   //注意这里不加()
    }
  },
  然后在后代组件接收使用:
    inject:['fun'],
  created() {
    this.fun()
  }

3. 复合写法:

 provide() {
    return {
      infos: this.info,    //这里是data中定义的数据
      fun: this.fun  //这里是methods中定义的方法
    }
  },
  接收:
  inject:['infos','fun'],   使用都是通过this  类似于普通的组件传值