描述：

最近在使用Element-UI 的 Form 組件時(shí)，遇到了給清空按鈕設(shè)置了resetFields()，點(diǎn)擊卻無(wú)法生效的問(wèn)題

解決：

表單項(xiàng) el-form-item 的 prop 屬性值應(yīng)該與表單項(xiàng)內(nèi)部控件的 v-model 保持一致

<el-form-item label="備注" prop="remarks"><el-input v-model="selectForm.remarks" /></el-form-item>

總結(jié)：

重置無(wú)效的幾種情況： 首先是官網(wǎng)的相關(guān)介紹：

方法名說(shuō)明

resetField	對(duì)該表單項(xiàng)進(jìn)行重置，將其值重置為初始值并移除校驗(yàn)
clearValidate	移除該表單項(xiàng)的校驗(yàn)結(jié)果

1、使用 resetField() 之前 el-form 一定要加 ref 屬性
2、表單項(xiàng) el-form-item 沒(méi)有添加 prop 屬性，同時(shí) prop 屬性值需與表單項(xiàng)的 v-model 保持一致
3、resetFields() 是將表單項(xiàng)重置為初始值，而這個(gè)初始值是在 Vue mounted 時(shí)賦值上去的，如果在這之前對(duì)表單進(jìn)行了賦值，則初始值會(huì)改變（例如 created 時(shí)），那么后面調(diào)用 resetFields() 則不會(huì)生效（不會(huì)是定義時(shí)的空值）。
解決方法：將賦值操作定義在 this.$nextTick() 中（保證了初始值不被修改）

本文轉(zhuǎn)載自：https://blog.csdn.net/weixin_44002092/article/details/109896767

總結(jié)

以上是生活随笔為你收集整理的Element-UI Form表单 resetFields() 重置表单无效问题的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。