vue3-Formularvalidierungsregeln werden nicht wirksam, resetFields

Vorwort: Ich bin auf dieses Problem gestoßen, weil ich die Daten im Dialogfeld nach der Bearbeitung löschen muss. Die Verwendung der herkömmlichen Zuweisung leerer Werte hat jedoch keine Auswirkung. In Kombination mit dem Schließereignis des Dialogfelds wird es gelöscht. Kommen wir ohne weitere Umschweife zum Code

  <!-- 新增弹出框 --> 
  <el-dialog v-model="state.dialogFormVisible" :title="state.title" @close="close">
    <el-form
      ref="ruleFormRef"
      :model="state.form"
      label="label position"
      label-width="130px"
      :rules="state.rules"
    >
      <el-form-item label="项目主审人账号" :label-width="formLabelWidth">
        <el-input v-model="state.userName" autocomplete="off" @blur="loseBlur" />
      </el-form-item>
    </el-form>
  </el-dialog>

<script setup>
 
// 编辑按钮事件 要放在nextTick里面 赋值的时候
function handleClick(value) {
  state.title = '编辑'
  state.dialogFormVisible = true
  const forms = state.form
  nextTick(() => {
    Object.keys(state.form).forEach((key) => {
      forms[key] = value[key]
      // console.log(forms[key], value);
    })
  })
}


// 弹出窗清空赋值
function close() {
  if (!ruleFormRef.value) return
  ruleFormRef.value.resetFields()
}

</script>