问题
今天在使用element-plus中表单的一个重置方法时,遇到了重置无效的问题,页面结构如下:
<el-form :model="formData" :rules="formRules">
<el-form-item prop="name">
<el-input type="text" v-model="formData.name" />
</el-form-item>
<el-form-item>
<el-input type="textarea" v-model="formData.memo" />
</el-form-item>
</el-form>
当我使用resetFields()
方法重置表单时,只有类型为text的输入框内容被重置了,但是textarea输入框没有被重置
发现
起初以为是resetFields()
方法对textarea无效,后来发现是该方法只对添加了表单验证的输入框才有效果,因为我只给text输入框添加了表单验证,所以才会出现一个生效一个不生效的问题
解决
我的解决方案是给textarea添加了一个验证,主要是要给<el-form-item>
节点添加prop属性即可解决问题
或者一个一个的将表单的值重新赋值也能解决,但是如果表单的值比较多的话就很麻烦
不知道还有没有别的解决方案,欢迎补充