VUE中关闭表单后重置表单以及清空表单校验

一般用于表单的新增或者编辑、查看等功能

目录

重置表单：

清空表单校验：clearValidate（）移除表单校验方法

resetFields() 移除校验结果并重置字段值

---

重置表单：

这里利用了一个偏门的小技巧，dialog对话框组件有个close，主要用途是Dialog 关闭的回调（详情可见Element-UI组件库），然后再close里直接给设置的表单数据对象重新赋值为空，这时点击取消，或者点击表单外，关闭表单再重新打开，内容就会清空

<template>
  <!-- 弹框 -->
  <el-dialog
    title="添加部门"
    :visible.sync="isShow"
    width="50%"
    // close事件 （复制请删除此行）
    @close="close"
  >
    <!-- 表单 -->
    <el-form ref="form" label-width="120px" :model="formData" :rules="formRules">
      <el-form-item label="部门名称" prop="name">
        <el-input v-model="formData.name" style="width:80%" placeholder="1-50个字符" />
      </el-form-item>
      <el-form-item label="部门编码" prop="code">
        <el-input v-model&