reactive是V3中响应式Api,但是在某些情况操作，会丢失响应式数据，不管是对象还是数组都不能直接将整个数据进行赋值，

一：丢失情况->直接赋值给定义的响应式对象，或者解构赋值

const tableData = reactive([]) // 定义
const { data } = await getTableDataApi() // 模拟接口获取表格数据
	tableData = data // 失去响应式

let obj=reactive({name:'zs'})
let {name}=obj//解构赋值

解决方案：

1：改为 ref 定义

const tableData =ref([])
tableData.value = data // 使用.value重新赋值

2：使用 push 方法，先解构再追加

tableData.push(...data)// 先使用...将data解构，再使用push方法

3：定义时数组外层嵌套一个对象

const tableData =reactive({list:[]})
tableData.list = data // 通过访问list属性重新赋值

4：赋值前再包一层 reactive

tableData = reactive(data) // 赋值前再包一层reactive

二：总结

1：ref 定义数据（包括对象），都会变成 RefImpl(Ref 引用对象) 类的实例，修改、赋值会调用 setter ，调用了 toReactive 方法，经过 reactive 方法处理为响应式对象。

2： reactive 定义数据（必须是对象），直接调用 reactive 方法处理成响应式对象。如果重新赋值，会丢失原引用地址，变成新的引用地址，指向的对象是没有经过 reactive 方法，是一个普通对象，不是响应式对象