vue3中对象或数组重新赋值不再是响应式?

为什么vue2对数组或对象进行赋值还是响应式,而vue3重新赋值后不再是响应式

<div>{{ obj1 }}</div>
<div>{{ obj2 }}</div>
<button @click="changeObj">修改</button>

let obj1 = ref({ name: "工具人" });
let obj2 = reactive({ name: "工具人" });
function changeObj() {
  //   obj1 = {name:"打工人"};
  //   obj2 = {name:"打工人"};
  obj1 = ref({ name: "打工人" });
  obj2 = reactive({ name: "打工人" });
}
阅读 5.7k
2 个回答

vue2 下,this 可以理解成一个大对象,所以怎么修改值都不会切断引用,保持响应性。
vue3 赋值要保持响应,就不要改变引用,否则无法被 proxy 监听

赋值方式有误

obj1.value = { name: '打工人' }
Object.assign(obj2, { name: '打工人' })
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题