记录el-form+el-dialog表单重置问题

2023-10-29

问题1:使用this.$refs[formName].resetFields()方法,表单无法重置

原因:resetField()方法不是将表单重置为空,而是重置为初始值

所以当我们打开新建表单的时候,表单项绑定的属性值为空,在提交表单后,表单项绑定的值不为空,此时再打开新建表单是会有上一次的值出现,此时resetField()方法是无法清空表单的,因为在这次操作的时候,属性初始值就不为空。

原博客:

https://blog.csdn.net/focusmickey/article/details/108646541

问题2:表单校验结果无法移除,再次打开时,会直接校验表单

出现这样"Cannot read property 'resetFields' of undefined"或者"Cannot read property 'clearValidate' of undefined",

问题分析:刷新界面后第一次新增,此时表单内的dom还没有加载完成就执行了"Cannot read property 'resetFields' of undefined"或者"Cannot read property 'clearValidate' of undefined",这样就导致报错。

原博客:

vue项目element-ui框架中的弹窗中的表单验证清除问题 - 只争朝夕,不负韶华 - 博客园

解决方法:

    // 弹窗关闭动画结束后事件
    closedFn() {
    // 重置表单
      this.formDialog = JSON.parse(JSON.stringify(this.newFormDialog))
    // 等弹窗里的form表单的dom渲染完在执行this.$refs.staffForm.resetFields(),去除验证
      this.$nextTick(() => {
    // 移除表单校验结果
        this.$refs.formDialog.clearValidate()
      })
    }

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

记录el-form+el-dialog表单重置问题 的相关文章

随机推荐

  • el-input输入框的那些事

    vue3 element plus ts es6 此帖只为记录开发中遇到的需求 技术问题 坑 1 文本域禁止自由拉伸 1 文本域禁止自由拉伸 el input有一个枚举类型的resize属性 控制拉伸 none both horizonta
  • 相关性模型与回归模型(例题代码)

    一 相关性模型 SPSS 相关性模型涉及到两种最为常用的相关系数 皮尔逊person相关系数 斯皮尔曼spearman等级相关系数 1 皮尔逊相关系数 相关性可视化 总结 1 如果两个变量本身就是线性的关系 那么皮尔逊相关系数绝对值大的就是
  • 系统安装部署系列教程(三):VHD方式安装系统

    普通的系统安装方式需要占用一个分区 假如某个分区有很多富裕空间 而且并不想完全格式化分区 可以考虑使用虚拟磁盘方式 VHD 安装系统 使用VHD方式安装的系统 只会占用一个文件 将来不需要的时候直接删除这个文件即可 而且VHD方式安装系统不
  • python多维list去重

    一维的list去重可以用set list 但是二维的list转set就会报错 unhashable type list 原因是set传进来的是不可哈希的变量 Python中那么哪些是可哈希元素 哪些是不可哈希元素 可哈希的元素有 int f
  • 期权策略篇: 实现买方狂欢,让卖方稳赚不赔的策略

    欢迎来到期权策略篇 实现买方狂欢 让卖方稳赚不赔的策略 今天给大家带来的期权策略比较简单 是我们比较常见的四种单腿期权策略 这四种策略分别是买入看涨期权 买入看跌期权 卖出看涨期权 卖出看跌期权策略 本文来自 期权酱 这四种期权策略相对于之
  • 7.27 总结+复盘

    一 初赛错题解析 第一题 题目 解析 像素位 字节位 字节 故选B 第二题 题目 解析 送命题 不会就是不会 做不会只能感叹自己道行甚浅 B选项是代码托管仓库 第三题 题目 解析 选A没啥好说的 记住就好 好奇怎么实现 请自行搜索 拓展一个
  • 2023更新阿里云服务器租用价格表(超详细)

    阿里云服务器分为云服务器ECS和轻量应用服务器 云服务器u1公网带宽可选1M到5M 系统盘为ESSD云盘40GB起 CPU内存配置可选2核2G 2核4G 4核8G 8核16G等配置 云服务器s6公网带宽可选1M到5M 系统盘40G起可选高效
  • 运放单的电源供电和双电源供电

    我们经常看到很多非常经典的运算放大器应用图集 但是他们都建立在双电源的基 础上 很多时候 电路的设计者必须用单电源供电 但是他们不知道该如何将双电源 的电路转换成单电源电路 在设计单电源电路时需要比双电源电路更加小 1 1 电源供电和单电源
  • vue后台管理动态路由-页面刷新之后跳转到默认页面的问题

    路由我们是用公共路由 动态路由 写的过程中发现 在动态路由的页面刷新页面后跳转到了默认页面 也就是我们设置的 path pathMatch redirect dashboard hidden true 本来这行代码我是写到公共路由里面了 就
  • 技术爆炸已至,AIGC(AI-Generated Content)带来内容产业全新格局

    公众号 做棵大树 欢迎关注一起进步 最近 在元宇宙概念大火的同时 人工智能技术也正在迎来新一轮的爆发 Chat GPT AIGC AI Generated Content 人工智能生成内容 正在成为一个新的风口 AIGC 即人工智能生成内容
  • Proteus元件库元件名称及中英对照表

    以下是具体内容 AND 与门 ANTENNA 天线 BATTERY 直流电源 BELL 铃 钟 BVC 同轴电缆接插件 BRIDEG 1 整流桥 二极管 BRIDEG 2 整流桥 集成块 BUFFER 缓冲器 BUZZER 蜂鸣器 CAP
  • 改进YOLO系列:4.添加ACmix注意力机制

    添加ACmix注意力机制 1 ACmix注意力机制论文 ACmix注意力机制原理 ACmix注意力机制的配置 common py配置 yolo py配置 yaml文件配置 1 ACmix注意力机制论文 论文题目 On the Integra
  • 上帝掷骰子吗--量子物理史话

    上帝掷骰子吗 量子物理史话 第一章黄金时代 一 我们的故事要从1887年的德国开始 位于莱茵河边的卡尔斯鲁厄是一座风景秀丽的城市 在它的城中心 矗立着著名的18世纪的宫殿 郁郁葱葱的森林和温暖的气候也使得这座小城成为了欧洲的一个旅游名胜 然
  • C++智能指针简单剖析

    转自 https www cnblogs com lanxuezaipiao p 4132096 html 导读 最近在补看 C Primer Plus 第六版 这的确是本好书 其中关于智能指针的章节解析的非常清晰 一解我以前的多处困惑 C
  • 如何有效地进行代码 Review

    前言 作为公司代码委员会 golang 分会的理事 我 review 了很多代码 看了很多别人的 review 评论 发现不少同学 code review 与写出好代码的水平有待提高 在这里 想分享一下我的一些理念和思路 为什么技术人员包括
  • select下拉框赋值和取值

    jq的select常用的方法 一 下拉框赋值 1 已创建select的下拉框 选中option的value为jquery 例 szfs val jquery 选中option的text为jquery 例 select id option t
  • 五分钟搭建Jetbrains家族IDE授权服务器

    作为Java码农 IntelliJ IDEA可谓是N0 1的开发环境了 对框架的支持 界面 插件都是比较方便的 大大加快了开发的速度以及开发的乐趣 酷炫的界面也能大大的装一个逼 虽然这里教大家搭建授权服务器 但是月入1狗的同志还是支持一下人
  • LVGL学习笔记

    文章目录 前言 一 软件安装 1 VSCode安装 2 MSYS2安装 二 配置环境 1 添加环境变量 2 配置msys2环境 3 配置VSCode 三 运行lvgl示例 前言 最近需要使用LittlevGL 以下简称lvgl 做ARM开发
  • 比较C Sharp和Java

    本文对比C 与Java编程语言 因为这两种语言都具有自动垃圾回收以及运行时编译执行的特点 并且他们的语法都是继承自C语言 C 因此二者有个很多相似之处 但由于C 也被描述为一个C 和Java的混合体 并添加了一些新特性 引入了一些变化 因此
  • 记录el-form+el-dialog表单重置问题

    问题1 使用this refs formName resetFields 方法 表单无法重置 原因 resetField 方法不是将表单重置为空 而是重置为初始值 所以当我们打开新建表单的时候 表单项绑定的属性值为空 在提交表单后 表单项绑