ElementUI的表单验证及常用规则续集// https://www.jianshu.com/p/d71dc34193b4
dialog中使用ElementUI表单验证时,我们在关闭dialog与点击提交后需要将表单内容清空,并取消验证。使用 this.$refs[form].resetFields();将form表单重置
所以将dialog关闭事件中添加内容清空的方法即可,
//@close是dialog的关闭事件
<el-dialog title="申请撤销" :visible.sync="dialogFormVisible" @close="closeDilog('form')">
<el-form :model="form" ref="form" :rules="rules">
<el-form-item label="撤销原因 :" prop="reason" :label-width="formLabelWidth">
<el-input v-model="form.reason"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="cancelReport('form')">提 交</el-button>
</div>
</el-dialog>
关闭方法
closeDilog:function(form){
this.dialogFormVisible = false;
this.$refs[form].resetFields();//将form表单重置
},