在vue3中使用 setup reactive 给表格赋值，当再次赋值的时候，表格数据无变化

Question

之前使用react写程序，最近因为项目的原因，开始使用vue3的编写前端，遇到一个问题，如题所述
：网络获取数据以及赋值都是正确的，获取的数据报304错误。
现在的问题是，页面前端无法赋值，且每次通过select选择新的表格后，数据都不能保存。
写到这里，基本也就是两个问题
一是：表格多次赋值，页面状态不改变
二是：页面切换采用SELECT切换表格之后，以前的表格状态被清空，如何保持

先谢谢各位给予的帮助

export default defineComponent({

    setup(){
         const state = reactive({
              data:[],
         })
         return {
            ...toRefs(state),
        ｝    
    }

})

这个语法糖格式如何赋值？

Answer 1

Vue3 响应式使用 proxy 代理拦截，如果你是用 reactive api 重新赋值相当于没有被拦截到，所以不会触发响应式更新

1.使用 Object.assian 的方式批量更新
2.使用 ref api 包裹

你的更改要基于操作对象的属性，而不是替换整个对象，否则无法响应式。