provide (提供)/inject(注入)

provide (提供)/inject(注入)

provide (提供)/inject(注入)默认情况下，不是响应式的
祖孙通信

祖先组件
  data(){
return{
  aaa:'hello'
    }
  },
  // provide:{aaaaaa:'hello'}  //固定值
  //如果想去访问组件实例的属性需要一个返回对象
  provide(){  
return{
  aaa:this.aaa
    }
  }
}
孙子组件
 inject:["aaa"]

响应式provide (提供)/inject(注入)

祖先组件中

export default{
  components:{Dierge},
  data(){
    return{
  bbb:'hello',
  // obj:{
  //   bbb:'hello'
  // }
}
 },
provide(){
    return{

  	 obj:this.obj, 响应式对象方式
 	 bbb:()=>this.bbb //函数返回响应式数据
    }
 }

孙组件中

computed:{
    newbbb:function(){
        return this.bbb()
    }
},
inject:["obj"]，
inject:["bbb"]
<div>
	<p>hello----{{ obj.bbb }}</p>
    <p>hello----{{ newbbb }}</p>
</div>