shallowReactive没有起效果,用isReactive输出person.name 理论上应该为true
const person = shallowReactive({
// 只将第一层数据做了响应式处理
name: '张三',
age: 18,
likeFood: {
fruits: {
apple: '苹果' // 深层次的数据将会是一个普通的对象
}
}
})
onMounted(() => {
//输出后发现是两个false 只输出person为true
console.log(
isReactive(person.name),
'...............',
isReactive(person.likeFood)
)
})
根据你的代码,person.name 是一个普通的值,而不是响应式对象,因此 isReactive(person.name) 应该返回 false。而 person.likeFood 是一个对象,因此应该是响应式的,但是由于你使用的是 shallowReactive,它只会对对象的第一层属性进行响应式处理,因此它的深层次的属性 fruits 中的 apple 并没有被响应式处理,所以 isReactive(person.likeFood) 也返回了 false。如果你想要对所有属性进行深层次的响应式处理,可以使用 reactive 代替 shallowReactive。
shallowReactive只会对第一层数据做响应式处理,所以person.name会是true,而person.likeFood中的深层次数据是一个普通的对象,所以会是false。