使用方法
http://news.558idc.com/602962.html
// 父组件
export default {
data() {
return {
count: 1
}
},
provide() {
return {
message: 'Hello from parent', // 正常传值
getCount: () => this.count
}
}
}
// 子组件A
export default {
inject: ['message', 'getCount'],
mounted() {
console.log(this.message); // 输出:Hello from parent
console.log(this.getCount()); // 输出:1 // 实时获取值
}
}
原因:provide和inject是一个非响应式的特性,当provide提供的数据发生变化时,不会触发子组件的重新渲染。所以在使用provide和inject时,需要注意数据的更新问题。
说明:传函数,返回要获取的实时的值,相当于给了一个地址,自己实时去那个地址拿,而不是直接把值一次性拷过来。
网友评论