vue resetfields未定义,form.resetFields
本文主要介绍了在vueform中使用resetFields函数时遇到的问题，具有很好的参考价值。希望对大家有帮助。如有错误或不足之处，请不吝赐教。
目录
在窗体中使用resetFields函数的问题。resetFields无效，分析解决方案并求解。
form表单使用resetFields函数的问题
今天想用添加和删除来使用一个对话框，涉及到点击添加按钮时清除表单数据的问题。我首先想到的是调用resetFields方法。
我直接写了之后是这样的
这个。$ refs[表单名]。重置字段()
结果直接报错了，于是上网百度，发现改成这样就不会报错了。
这个。$nextTick(function() {
const el: any=this。$ refs[formName]；
El . resetfields()；
});
所以我以为肯定能行，但是点开界面还是没有反应。最后去官网看了一下，发现表单的el-form-item里没有写道具属性。
最后，添加后，点击添加按钮时调用reset方法即可。
但是在使用它的时候，应该在调用之前将打开模型的变量设置为true，因为只有在设置为true之后才能找到对应的dom元素。而且还是要用nextTick。
resetFields失效，死活不起作用的解决
因为同一个表单用于添加、编辑和查看弹出的表单，但是打开和关闭编辑或查看表单后，再次打开新添加的表单，发现表单有以前的数据，resetFields无效。
分析
在检查了官方文档后，发现resetFields只重置了整个表单，将所有字段重置为初始值并删除验证结果。打开编辑表单时，表单字段的初始值是通过编辑获得的值。此时resetFields只是将表单字段重置为初始值，即编辑表单得到的值；
解决办法
eg：
某视频剪辑软件
El-dialog @ close=" handle close( userForm )"
el-input v-model=userForm.name
…
…
UserForm={
名称： ""，
年龄： ""，
}
在关闭子弹盒的方法中写入：
handleClose(formName) {
let resetForm={
名称： ""，
年龄： ""，
}
this[formName]=reset form；//清空表单
这个。$ refs[表单名]。resetFields()；//删除验证结果。然后写关闭子弹盒等其他方法。
}
PS:表单中的prop和v-model变量要一一对应
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。