How to clear the verification after closing the dialog in element ui

Now I will share with you a method to clear the verification conditions after closing the dialog in element ui. It has a good reference value and I hope it will be helpful to everyone.

Close dialog trigger event

//vue
 <!--添加用户dialog begin-->
   <el-dialog title="编辑用户" :visible.sync="dialogFormVisible"
     custom-class="editDialog"
     :close-on-click-modal="false"
     :before-close = "cleanContent"
     :show-close = "false"
     size=&#39;tiny&#39;>
<el-form :model="ruleForm" :rules="rules" ref="ruleForm">
 <el-form-item label="账户名" prop="account" label-width="100px" >
 <el-col :span="20">
 <el-input v-model="ruleForm.account" ></el-input>
 </el-col>
 </el-form-item>
 </el-form>
 <p slot="footer" class="dialog-footer">
 <el-button @click="cancledialog(&#39;ruleForm&#39;)">取 消</el-button>
 </p>
</el-dialog>

//js
cancledialog(formRule){
   this.$refs[formRule].resetFields();
 }

The above is what I compiled for everyone, I hope It will be helpful to everyone in the future.

Related articles:

What are the methods by which Vue can use CSS to replace scoped with modules?

How to use Vuex to implement the counter function

In-depth explanation of the basic principles of the webpack module

The above is the detailed content of How to clear the verification after closing the dialog in element ui. For more information, please follow other related articles on the PHP Chinese website!