一、基本前提：
1、form组件上必须要有ref
2、form-item上必须要有prop属性
二、新增/编辑用一个el-dialog时，先新增再编辑没问题，先编辑再新增未清空
原因
在没有点新增或着编辑时，我的el-dialog弹出框里的内容是空白的，只有header和footer,
并没有body,只有el-dialog弹出时才会加载内容。
resetFields该方法是把表单的数据重置为初始值。并不是清空，因此可以想到：
当我们先新增在编辑，初始值是空的，调用resetFields()方法自然正常。
当我们先编辑在新增，会对表单赋值，初始值就是我们赋的值，调用resetFields()方法，表单里还有之前赋的值，并不是我们希望得到的清空表单。
解决--nextTick
Vue3 nextTick() 函数 | 菜鸟教程
nextTick()是 Vue 3 中的一个核心函数，它的作用是延迟执行某些操作，直到下一次 DOM 更新循环结束之后再执行。这个函数常用于在 Vue 更新 DOM 后立即获取更新后的 DOM 状态，或者在组件渲染完成后执行某些操作。为什么需要 nextTick()？
在 Vue 中，当你修改了数据后，Vue 并不会立即更新 DOM，而是将这些更新操作放入一个队列中，等待下一次事件循环时统一处理。这种机制被称为"异步更新队列"。
如果你在修改数据后立即尝试访问 DOM，可能会发现 DOM 还没有更新，从而导致获取的数据是旧的。
nextTick()就是为了解决这个问题而存在的，它确保你的操作在 DOM 更新完成后执行。nextTick() 的使用场景
以下是一些常见的使用场景：
- 在修改数据后立即获取更新后的 DOM 状态。
- 在组件渲染完成后执行某些操作，例如初始化第三方库。
- 在子组件更新后，父组件需要根据子组件的状态进行某些操作。
在编辑时，弹出框我们先让他初始化结束再赋值。
element-ui（vue2）：
edit(row) {this.visible = true;this.$nextTick(()=> {// 赋值})},element-plus（vue3）：
import { nextTick } from "vue";
edit(row) {visible.value = true;nextTick(()=> {// 赋值})},参考：
element-ui表单先编辑后新增resetFields()无效的坑_解决 element-ui 表单清空的问题:先编辑后新增 resetfields() 无效-CSDN博客
vue3+element-plus表单重置resetFields方法不生效踩坑_vue3 resetfields-CSDN博客
