#我们都知道es6出了个新特性,支持解构,使用过的人可能都觉得挺简单的,但有一些小点,只有使用中留意了或者踩坑了才发现我们认识的还很浅#
解构定义
允许按照一定模式,从数组和对象中提取值,对变量进行赋值
情境一
按照定义来说,我们只能解构数组和对象,但有一种特殊情况,解构空值也不会报错
错误场景
特殊场景
情境二
解构的对象里存在计算属性或者响应式对象(结合vue3知识的)
正确场景
执行结果:一致
错误场景
执行结果:只复制其值,丢失响应式特性
解决方案
toRefs转换为响应式
const newObj = {
...toRefs(oldObj),
}