element ui 重置表单 关闭表单内容重置

第一种方法

<el-dialog
      title="添加项目类型"
      :visible.sync="addRoleVis"
      :before-close="addClassClose"
      :close-on-click-modal="false"
      width="520px"
    >
      <el-form label-width="100px" :model="addClass" :rules="rulesClass" ref="addClass">
        <el-form-item label="项目类型: " prop="name">
          <el-input v-model="addClass.name" type="text" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submitAddClass('addClass')">添加</el-button>
          <el-button @click="addClassClose">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

method:{
  addClassClose(){
      this.$refs.addClass.resetFields();
      this.addRoleVis = false
   },
}

第二种方法

只需要在From标签上加上v-if="showDialog"这句代码，当关闭弹框时showDialog=false，
再次打开弹框是showDialog置为true，这样每次打开弹框它都会生成一个新的表单。