QQ_1727702625833.png
reactive 定义数据（对象），是直接调用 reactive 方法处理成响应式对象。如果重新赋值，就会丢失原来响应式对象的引用地址，变成一个新的引用地址，这个新的引用地址指向的对象是没有经过 reactive 方法处理的，所以是一个普通对象，而不是响应式对象。解构同理。
解决方法：
1.逐个赋值，如果属性比较少的话。
2.使用 Object.assign() 。
3.使用ref()来进行定义（最简单）
4.直接在reactive中嵌套一层
<script setup>
import { reactive } from 'vue';
// 定义一个响应式变量
const data = reactive ({
dataObj:{
name:"",
age:""
}
});
// 请求接口
axios.get('/api/data')
.then(res => {
// 修改的是data对象的dataObj这个属性，所以具有响应式
data.dataObj= res.data;
})
.catch(err => console.log(err));
</script>
