vue的provide和inject父子组件传值

provide和inject
提供 / 注入
作用：
父组件可以向其所有子组件传递数据，不管子组件层次结构有多深
特性：
父组件有一个 provide 选项来提供数据
子组件有一个 inject 选项来开始使用这个数据

组件层级：
parent组件 -> child1组件 -> child2组件 -> …

props方式传值： parent ->child1->child2
provide/reject方式传值： parent ->child1
parent ->child2

具体实现：
在parent组件中写入：

export default(){
 name:'parent',
 data(){
   return{
     arr:[1,2,3,4,5]
   }
 },
 provide(){
   return {
      arr:this.arr;
   }
 }
}

在child1和child2组件中写入：

export default(){
 name:'child1',
 inject:['arr'],
 data(){
   return{
      data:this.arr
   }
 },
}