vue中使provide中的数据变为响应式

正常使用provide的方式：

父组件中：

provide:{

　　for:'demo'

}

这样子组件中无论多深的子组件都可以使用：
inject:['for'],

data(){

　　return{

　　　　demo:this.for

　　}

}

但是上面的写法有一定的问题，比如父组件中for变量的值如果我们是在mounted方法中请求后台数据再更改provide中for的值，那么在子组件中获取不到更改后的for的值。

这时候就需要换一种写法：

父组件中：

  provide() {     return {       provObj: {         for: '',       },     };   },  mounted() { 　　  setTimeout(()=>{       this._provided.provObj.for= 'demo';     },2000); } 子组件中：

inject:['provObj'],

data(){

　　return{

　　　　demo:this.provObj.for

　　}

}

这样就可以获取到在mounted中才给provide赋上的值。

标签：vue,return,provide,demo,provObj,组件,中使,mounted
来源： https://www.cnblogs.com/maycpou/p/14858168.html