element ui里dialog关闭后清除验证条件

关注

原创最新推荐文章于 2026-05-01 09:23:15 发布 1.3w 阅读 AI 写同款· GEO 优化 ›

elementUI dialog 组件二次封装 before-close 回调函数作用 2、封装 dialog 组件为 baseDialog，子组件是一个 baseDialog+form 格式，将组件封装为 baseDialogForm，页面中使用 baseDialogForm。before-close 弹框关闭前的回调函数，父组件可以向子组件传递一个函数，用于修改子组件内的变量变量。1、封装 dialog 组件为 baseDialog，页面中使用 baseDialog 组件。场景2：将 baseDialog+form 封装为 baseDialogForm 组件。阅读详情

关闭dialog触发事件

//vue
  <!--添加用户dialog begin-->
            <el-dialog title="编辑用户" :visible.sync="dialogFormVisible"
                 custom-class="editDialog"
                 :close-on-click-modal="false"
                 :before-close = "cleanContent"
                 :show-close = "false"
                 size='tiny'>
<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>
  <div slot="footer" class="dialog-footer">
  <el-button @click="cancledialog('ruleForm')">取 消</el-button>
 </div>
</el-dialog>

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