Vue2与Vue3的区别

https://zhuanlan.zhihu.com/p/139590941

ref

ref 做响应式

ref 获取DOM

resetFields()不生效的原因：

已知道：我在 setup 里面调用的 ref.value.resetFields()，这个时候初值都还没有。初值是在form mounted生命周期被赋值上去的

1.此方法用于将form表单的数据设置为初始值。

2.这个初始值是在form mounted生命周期被赋值上去的。

3.在form  mounted之前，如果给form表单赋值，那么后面调用resetFields()都是无效的，因为form表单的初始值已经在mounted之前就被赋值了。

参考：ref 在 vue3 的初始化/挂载

setup

setup的异步、试图更新问题 

Vue3 的一大特性函数 ---- setup

　　1、setup函数是处于 围绕 beforeCreate 和 created 生命周期钩子运行  也就说在 setup函数中是无法 使用 data 和 methods 中的数据和方法2

　　3、在setup函数中定义的变量和方法最后都是需要 return 出去的 不然无法再模板中使用

二、setup函数的注意点：

　　1、由于在执行 setup函数的时候，是 Created 之前，所以在 setup 函数中，无法使用 data 和 methods 的变量和方法。Vue 为了避免我们错误的使用，直接将 setup函数中的this修改成了 undefined

　　3、setup函数只能是同步的不能是异步的

toRef

toRef 出来的值是只读的！我们能改变的是 .value 的值！

例如 

const { xxx } = toRefs(props);

emit('update:image', image); // 这会导致 父组件的 image 无法更改
emit('update:image', image.value); // 这个 value 才是正确的写法