vue3(语法糖)reactive数据直接赋值将失去响应式

1.直接赋值导致失去响应式

• 因为reactive数据被重新赋值后，原来数据的代理函数和最新数据的代理函数不是同一个

• 结果：

  
  
  image.png

2.解决方法

• 方法一： reactive定义一个对象，对象里的每个属性都具有响应式

• 方法二：使用ref定义

• 结果：

  
  
  image.png