vue3使用踩坑总结

1、使用reactive定义的对象定义对象时，后面由于页面需求需要，把这个对象设置为空对象，如果直接把变量设置{}会导致响应式失效！

state = reactive({})由于后面业务需求需要把State设置为空对象 state = {} 正常的做法是这样，这个时候就会出现响应式丢失问题！

注：在实际应用中，你应该避免直接将reactive对象赋值为空对象，因为这会导致原有响应式跟踪失效（鼠标输入文字input框没有同步显示出来，卡顿，消失）。如果需要重置响应式对象，请考虑清除对象内部的属性或使用其他响应式机制来管理状态。

解决方法，循环一个清除内部的对象

    // 移除掉未保存的添加项，解决再次进来保存bug
    // editableItemsData = {}
    if(Object.keys(editableItemsData).length > 0) {
      Object.keys(editableItemsData).map(key=> {
        delete editableItemsData[key]
      })
    }