先上手册链接 https://cn.vuejs.org/v2/api/#provide-inject

provideinject是做什么用的呢?

正常情况下我们使用v-bindprops来进行父子组件间的传值,如果是爷父孙组件那么就需要在每层都使用v-bindprops进行传值,如果是更多的层级呢?显然,这不是最优雅的解决方式。
引用官方的一句话:provideinject 主要在开发高阶插件/组件库时使用。并不推荐用于普通应用程序代码中。

如何使用?

首先需要在祖先组件定义provide,比较类似于data的声明方式

然后在需要使用的子孙组件中使用inject接收值
就ok了,非常的简单。
在 2.5.0+ 中也支持设置默认值以及更改接收值的名,具体可以查看手册

注意

provideinject 绑定并不是可响应的。这是刻意为之的。然而,如果你传入了一个可监听的对象,那么其对象的 property 还是可响应的。
解释一下就是通过inject接收的值是不会根据祖先组件中的值变化而变化的
经过测试 当传入一个可监听的对象的时候 inject接收的值是可以动态变化的

举个栗子

data () {
  return {
    test: { status: 1 }
  }
},
provide () {
  return {
    provideTest: this.test
  }
}