provide/injectprovide/inject的使用在Vue2.2.0之后，Vue还提供了provide/i

provide/inject的使用

在Vue2.2.0之后，Vue还提供了provide/inject选项，这对选项允许一个祖先组件向其所有子孙后代组件注入一个依赖，不论组件层次有多深，并在起上下游关系成立的时间里始终生效。在父组件只要声明了provide，在其子组件，孙组件，曾孙组件等能形成上下游关系的组件中交互，无论多深都能通过inject来访问provider中的数据，而不是局限于只能从当前父组件的prop属性来获取，所以可以把provide看作大范围的有效的prop。注意他只能做祖先通后代的单向传递的一个办法。这对选项任意层级的子组件都能访问到。

缺点：任意层级可以申明，其后的子组件层级可访问，导致数据追踪比较困难，不明确哪些层级申明了provide，哪些层级使用了inject,维护成本比较高,还是建议用Vuex解决

使用方法：

provide 提供变量
inject 注入变量

provide 选项应该是一个对象或返回一个对象的函数，使用方法为：

export default { //父组件提供provide
  name: 'Login',
  provide: {
    test: 'zhangsan',
    age: '20',
  },
  data() {},
}

子组件接受注入的值

export default {
  name: 'DialogInfo',
  props: {
    dataInfo: {
      type: Object,
      default: () => {},
    },
  },
  inject: ['test', 'age'], //子组件使用
  data() {
    return {};       
  },
  created() {
    console.log(this.test, 'test=========');
    console.log(this.age, 'age=========');
  },
}