Vue2中的依赖注入的使用provide / inject

在Vue项目的开发中，我们经常会遇到组件嵌套层级过深的问题，常用的两种方式，链式调用以及emit触发，在多组件嵌套中都有一定的不足，例如链式调用记得的降低了组件的可复用性，因为组件后面所处的层级是可变的，另一边emit触发方法的传递则需要传递的层数过多，代码过于臃肿，不易维护，所以对于多组件嵌套来说，我们建议通过provide / inject进行方法以及属性的传递。

一、通过provide / inject实现组件的传参

废话不多说，直接上代码

结构如下，共三级，父子孙三层组件

 父组件代码：

子组件代码：

孙组件代码：

二、简要补充说明

传递响应式的数据，需要传递一个方法过去，去触发方法，建立关联。不然得到的是初始data里面的值，不是响应式的。

inject可以设置默认值，跟props类似

provide / inject需要搭配使用，当父组件没有传递，子组件接收也会报错。