Vue3的表单重置功能失效

在我用表单功能做新增修改的时候，遇到了点新增时清空表单的问题；

         <el-button type="primary" @click="onAdd" size="small">新增</el-button>
        <el-form :inline="true" :model="updateList" class="demo-form-inline" ref="formRef" :rules="rules">
            <el-form-item label="角色编号" prop="roleId">
               <el-input v-model="updateList.roleId" placeholder="角色编号" clearable style="width: 10vw;" />
            </el-form-item>
            <el-form-item label="角色名称" prop="roleName">
               <el-input v-model="updateList.roleName" placeholder="角色名称" clearable style="width: 10vw;" />
            </el-form-item>
            <el-form-item>
               <el-button type="primary" @click="onSave(formRef)">{{ addOrUpdate }}</el-button>
               <el-button type="primary" @click="resetForm()">重置</el-button>
            </el-form-item>
         </el-form>

这样，我想在新增时清空表单

//编辑
const handleEdit = (index: number, row: any) => {
   drawer.value = true
   addOrUpdate.value = '编辑'
   Object.assign(updateList,row)
}
//定义一个ref对象绑定表单
const formRef = ref<FormInstance>()
//新增
const onAdd = () => {
   console.log("queryList", queryList);
   drawer.value = true
   addOrUpdate.value = '新增'
   resetForm()
   
}
// 重置表单
const resetForm = () => { 
   formRef.value?.resetFields()
   
}

结果老是失败，查了一下，发现是编辑功能里赋值时的问题，解决如下

//编辑
const handleEdit = (index: number, row: any) => {
   drawer.value = true
   addOrUpdate.value = '编辑'

// 编辑按钮事件 要放在nextTick里面 赋值的时候
   nextTick(() =>{
      Object.assign(updateList,row)
   })
}
//定义一个ref对象绑定表单
const formRef = ref<FormInstance>()
//新增
const onAdd = () => {
   console.log("queryList", queryList);
   drawer.value = true
   addOrUpdate.value = '新增'
   resetForm()
   
}
// 重置表单
const resetForm = () => { 
   formRef.value?.resetFields()
   
}