vue3使用Object.assign方法重置reactive变量的值

 示例代码

<div>{{ person.id }} {{ person.name }}</div>

const person:any = reactive({id:10000, name:'哈哈'});
setTimeout(() => {
  person.value = {id:10001, name:'吼吼'};
  
}, 3000);

setTimeout(() => {
  person.value = Object.assign(person, {id:10002, name:'呵呵'});
  
}, 5000);

运行结果

页面初始化显示：

3秒后页面显示不变化，控制台打印person.value，发现变量的值已变为：

5秒后页面显示：

总结

reactive定义的变量直接用=号赋值会丢失响应式，可以用Object.assign()进行赋值。