reactive 丢失响应式问题

reactive声明的响应式，vue3 使用proxy，对于对象和数组都不能直接整个赋值

let arr=reactive([1,2,3]);
arr=[4,5,6]  //arr会丢失响应式

// 这几种办法都可以触发响应性，推荐第一种
// 方案1：创建一个响应式对象，对象的属性是数组
const state = reactive({
    arr: []
});
state.arr = [1, 2, 3]

// 方案2: 使用ref函数
const state = ref([])
state.value = [1, 2, 3]

// 方案3: 使用数组的push方法
const arr = reactive([])
arr.push(...[1, 2, 3])

let obj = reactive({
	name: 'zhangsan',
	age: '18'
})
obj = {
	name: 'lisi'
	age: ''
}
// 上面这样赋值检测不到，因为响应式的是它的属性，而不是它自身
			
// 如需要对 reactive 赋值
// 方法1: 单个赋值
obj['name'] = 'lisi';
obj['age'] = '';
// 方法2：多包一层
let obj = reactive({
	data: {
		name: 'zhangsan',
		age: '18'
	}
})
obj.data = {
	name: 'lisi'
	age: ''
}

参考文章
https://blog.csdn.net/nullzzzz/article/details/122464080