Vue Element Form表单 resetFields重置无效

2023-11-08

原因有两点:
el-form 标签需要绑定 ref 和 :model 属性
el-form-item 标签要绑定 prop 属性
重置表单

添加一个是否加载的开关  v-if="dialogVisible" ,由 dialogVisible的值来 控制 组件el-dialog是否重新加载。
<el-dialog
      v-if="dialogVisible"
      v-model="dialogVisible"
      :title="saveOrupdateTitle"
      width="50%"
      :close-on-click-modal="false"
      @close="closeDialog('noteForm')"
  >

工具类 resetForm.js

//重置表单和表单数据
export default function resetForm(fromName, obj) {
  //清空表单
  if (this.$refs[fromName]) {
    this.$refs[fromName].resetFields()
  }
  //清空数据域
  Object.keys(obj).forEach(key => {
    obj[key] = ''
  })
}
openDeptDialog() {
      //清空表单数据
      this.$resetForm("deptForm", this.dept);
      //this.$refs[formName.toString()].resetFields()
      this.deptDialog.title = '新增部门'
      this.deptDialog.visible = true
    }
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Vue Element Form表单 resetFields重置无效 的相关文章

随机推荐

  • springboot设置logback-spring.xml的加载路径

    springboot将应用程序打包成jar以后 默认是将logback spring xml放在jar包里面根路径下 图 如果我们需要springboot加载jar包外部的logback spring xml应该怎么做了 例如我们想加载与x
  • shuffle机制详解

    将map输出作为输入传递给reducer的过程称为shuffle Shuffle过程包含在Map和Reduce两端 map阶段大致过程为 写数据 分区 排序 将属于同一分区的输出合并一起写在磁盘上 每个map任务都有一个环形内存缓冲区用于存
  • 服务里面找不到MySQL

    今天在连接数据库时发现自己的数据库出现了问题 在命令窗口输入 net start mysql 命令 还是启动不了 发现在服务里面竟然没有mysql服务了 1 以管理员身份运行cmd 切换到mysql安装目录的bin路径下 2 运行命令 my
  • C++构造函数简单实现电梯控制程序

    对于电梯 属性之一就是位置 所以要实现这一程序 要设置电梯的初始位置和按下电梯按钮改变的电梯的位置 代码如下 include
  • 【Linux】利用云服务器搭建云盘替代百度网盘、OneDrive等,docker安装seafile服务端,实现网页端上传下载,本地Linux、Windows安装客户端实时同步

    写在前面 博主使用OneDrive比较多 教育版有1t的大小 但是由于OneDrive在Linux系统中通过API不能连接学校的教育版 因此迫切需要一个云盘来替代OneDrive 由于之前也使用过Seafile 因此考虑使用Seafile搭
  • 编辑器正则替换px为rem

    正则部分 d d px 被替换部分 calc 1rem 100 注 此方法只能替换原css文件内无calc 运算的
  • 关于Unicode,UTF-8,GB编码详解

    内容来自网络 有部分修正 一 首先我们需要明白关于字符 character 字符集 character set 字符编码方式 character encoding 的概念 字符 字符是抽象的最小文本单位 它没有固定的形状 可能是一个字形 而
  • [901]sqlite数据库的导出与导入

    文章目录 SQLite 获取所有表名 通过 sqlite3 test db 命令进入sqlite数据库的shell 操作 python 脚本 help 直接导出csv文件 SQLite 仅仅支持 ALTER TABLE 语句的一部分功能 我
  • ansible常用模块使用方法

    ansible playbook执行方法 这个是你选择的主机 hosts webservers 这个是变量 vars http port 80 max clients 200 远端的执行权限 remote user root tasks 如
  • 实战技术产品经理

    文章转自 人人都是产品经理 并不代表企业实战 工具使用 办公工具的使用比如AXURE OFFICE 云笔记 PS等 决定办公效率 系统熟练 对后端数据及前端设计规范的了解程度 决定验收能力和设计合理度 沟通表达 对开发跟进及资源争取方面的推
  • 【强化学习】

    强化学习DQN 提示 写完文章后 目录可以自动生成 如何生成可参考右边的帮助文档 文章目录 强化学习DQN DQN算法的简介 一 环境的介绍 二 DQN算法 1 DQN算法的关键技术 2 DQN代码 2 1 导入库 2 2 定义类 2 3
  • Ubuntu 22.04.3 LTS安装

    最近换电脑了 准备重新装一下ubuntu 多年前装过ubuntu很老的版本 现在发现官网最新的LTS版本是 Ubuntu 22 04 3 LTS 版本 那重新装的话 肯定装最新的版本了 这里我记录下自己的安装过程 作为以后的笔记查看 我的环
  • Android 添加开启/关闭应用信息界面的接口

    修改记录 mt67xx 11 0 应用信息界面是个Fragment不是Activity 不能用pm setComponentEnabledSetting方法做禁用 a alps vendor mediatek proprietary pac
  • oracle 12.2.0.1 opatch lsinventory时报LsInventorySession failed: RawInventory gets null OracleHomeInfo

    grid node1 opatch lsinventory detail oh u01 app 12 2 0 grid Oracle Interim Patch Installer version 12 2 0 1 25 Copyright
  • Socks5代理:网络安全与爬虫之利器

    一 Socks5代理 简介与工作原理 Socks5代理 全称为Socket Secure 5代理 是一种允许用户通过代理服务器进行网络连接的技术 它是Socks协议的最新版本 在网络安全和数据传输方面有着显著的优势 Socks5代理与其他代
  • `计算机知识` 驱动程序

    catalog 驱动 全称为 设备驱动程序 Device driver 首先 我们的计算机 是无法直接和 外部硬件设备 显卡 声卡 进行通信的 因为 我们的计算机 OS 编程语言 使用的是 代码 而外部硬件设备 识别的是 电子信号 这两个是
  • 基于Java的学生管理系统

    学生管理系统ManageSystem 一 系统架构与环境 1 1 springboot2 3 4 1 2 maven3 3 9 1 3 jdk1 8 1 4 mysql5 7 1 5 ssm架构单服务节点 二 具备的功能 1 用户管理 2
  • Digital Ocean 搭建属于自己的网站

    首先 需要Digital Ocean账号申请以及环境搭建的参考博客 https blog csdn net hunzhangzui9837 article details 85209245 下面 开始Digital Ocean 网站搭建 1
  • 内存单位及换算

    单位换算 内存单位及换算 位 bit 数据储存最小单位 字节 Byte 基本数据存储单位 内存单位及换算 换算单位太多 记下来供查阅 位 bit 二进制一个数字 0或1 即是一位 数据储存最小单位 字节 Byte 每8位为一个字节 1Byt
  • Vue Element Form表单 resetFields重置无效

    原因有两点 el form 标签需要绑定 ref 和 model 属性 el form item 标签要绑定 prop 属性 重置表单 添加一个是否加载的开关 v if dialogVisible 由 dialogVisible的值来 控制