Cannot read properties of undefined (reading ‘resetFields‘)“ 报错解决

news2024/9/24 9:23:49

在这里插入图片描述
遇到这种报错 先去相关页面搜索关键字 定位到具体的报错代码
Cannot read properties of undefined (reading ‘resetFields’)"
关键字:resetFields
此方法作用:对整个表单进行重置 将所有字段值重置为初始值并移除校验结果

报错场景:点击编辑按钮 弹窗弹出时 控制台报错

	init(id) {
		this.visible = true
		this.$refs['dataForm'].resetFields()
		if(id) {
			// 发送axios请求 获取数据反显到表单上
		}
	},		

原因:this.$refs['dataForm'].resetFields()在执行的时候 表单的dom还没有渲染出来
因为还没渲染出 所以用$refs调用名叫‘dataForm’身上的resetFields方法 是undefined

解决方法: 使用$nextTick包上 等待dom更新之后再重置

	init(id) {				
		this.visible = true				
		this.$nextTick(() => {
			this.$refs['dataForm'].resetFields()
			if(id) {
				// 发送axios请求 获取数据反显到表单上
			}
		})				
	},		

也可以先判断 确认能获取到dataForm再重置

if (this.$refs.dataForm != undefined){
    this.$refs["dataForm"].resetFields();
 }

另外还有一种报错情况 编辑弹窗打开后 某项数据明明有值 却报必填校验错误
控制台:xxx is required
在这里插入图片描述
这种情况大概率是 当前数据项 input里的v-model和el-form-item上的prop绑定的值不一致

<el-col :span="12">
	<el-form-item label="数据项" prop="dataItems">
		<el-input clearable v-model="dataForm.dataItem" placeholder="数据项"></el-input>
	</el-form-item>
</el-col>

同改为dataItem即可

<el-col :span="12">
	<el-form-item label="数据项" prop="dataItem">
		<el-input clearable v-model="dataForm.dataItem" placeholder="数据项"></el-input>
	</el-form-item>
</el-col>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1237093.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

基于高质量训练数据,GPT-4 Turbo更出色更强大

11月7日消息&#xff0c;OpenAI在首届开发者大会上正式推出了GPT-4 Turbo。 与GPT-4相比&#xff0c;GPT-4 Turbo主要有6方面的提升&#xff1a; 1、扩展下文对话长度&#xff1a;GPT4最大只能支持8k的上下文长度&#xff08;约等于6000个单词&#xff09;&#xff0c;而GPT-4…

Go 异常处理流程

在 Go 语言中&#xff0c;panic、recover 和 defer 是用于处理异常情况的关键字。它们通常一起使用来实现对程序错误的处理和恢复。 1. defer 语句 defer 用于在函数返回之前执行一段代码。被 defer 修饰的语句或函数会在包含 defer 的函数执行完毕后执行。defer 常用于资源清…

Django学习日志09

choices参数的使用 """对于以上可能被我们列举完的字段我们一般都是选择使用choices参来做""" class UserInfo(models.Model):username models.CharField(max_length64)password models.CharField(max_length32)# 先写一个映射关系gender_cho…

电机应用开发-直流有刷电机速度环控制实现

直流有刷电机速度环控制实现 硬件设计 可选&#xff1a;L298N电机驱动板、野火MOS搭建的驱动板。 直流电机速度环控制-位置式PID实现 编程要点 配置定时器可以输出PWM控制电机 配置定时器可以读取编码器的计数值 配置基本定时器可以产生定时中断来执行PID运算 编写位置式PID算…

如何选择一款快速可靠的文件自动同步软件?

在企业的数据流转管控过程中&#xff0c;经常会遇到频繁的数据备份、同步&#xff0c;人工重复这样的工作程序&#xff0c;既繁琐又容易出错。越来越多的企业&#xff0c;要求内部各种业务数据在多台服务器之间、多个数据中心之间&#xff0c;乃至多云和本地之间调度和同步。很…

黔院长 | 中医上所说的虚实到底是什么?

虚实是中医上经常出现的词语&#xff0c;例如脾虚、肾虚等也都是我们经常听到的症状。各种病症的发生都有虚实的不同&#xff0c;那什么是虚实呢&#xff1f;在《黄帝内经》当中就有相关的叙述&#xff1a; 所谓虚实&#xff0c;是正气与邪气相比较而言的。什么是正什么是邪&am…

python 实现银行卡号查询银行名称和简称

本章教程利用python实现查询银行卡号名称和简称 。 目录 一、 实例代码 二、运行效果 一、 实例代码 #!/usr/bin/python # -*- coding: UTF-8 -*- """ author: Roc-xb desc: python 实现银行卡号查询银行简称 """ import requestsdef bank_mes…

Java入门篇 之 内部类

本篇碎碎念&#xff1a;本篇没有碎碎念&#xff0c;想分享一段话&#xff1a; 你不笨&#xff0c;你只是需要时间&#xff0c;耐心就是智慧&#xff0c;不见得快就好&#xff0c;如果方向都不对&#xff0c;如果心术不正&#xff0c;如果德不配位&#xff0c;快就是对自己天分的…

如何配置ESB单据集成接口

ESB企业服务总线在实际项目中主要用于各业务系统之间的集成&#xff0c;集成包括数据集成、应用集成以及业务单据集成等&#xff0c;ESB企业服务总线主要包含三部分&#xff1a;ESB设计器、SMC管理控制台以及Server运行环境&#xff0c;ESB设计器用于服务以及集成流程的开发&am…

关于sklearn的:还可能是网络的问题???

前提&#xff1a;安装sklearn需要 numpy、scipy等库&#xff08;这个自行搜索&#xff09; 昨天安装numpy、scipy很快&#xff0c;一会就好了&#xff0c;然后安装sklearn一直报错&#xff0c;还以为是版本问题。 今天大早上起来&#xff0c;再次安装&#xff0c;顺利成功&…

②⑩ 【MySQL Log】详解MySQL日志:错误日志、二进制日志、查询日志、慢查询日志

个人简介&#xff1a;Java领域新星创作者&#xff1b;阿里云技术博主、星级博主、专家博主&#xff1b;正在Java学习的路上摸爬滚打&#xff0c;记录学习的过程~ 个人主页&#xff1a;.29.的博客 学习社区&#xff1a;进去逛一逛~ MySQL日志 ②⑩ MySQL日志&#xff1a;错误日志…

Speech | openSMILE语音特征提取工具

官方地址&#xff1a;openSMILE 3.0 - audEERING 使用指导&#xff1a;openSMILE — openSMILE Documentation (audeering.github.io) openSMILE 简介 openSMILE是一款以命令行形式运行的工具&#xff0c;通过配置config文件来提取音频特征。主要应用于语音识别、情感计算、音…

ERP对接淘宝/天猫/京东/拼多多商品详情数据API接口

引言 今天&#xff0c;我们时代变化非常快&#xff0c;传统行业做法&#xff0c;已经无法完全适应时代的发展。互联网的发展&#xff0c;造成了一股网购热。京东&#xff0c;天猫&#xff0c;淘宝&#xff0c;易购……网购&#xff0c;给我们生活带来了方便&#xff0c;消费者…

【产品安全平台】上海道宁与Cybellum将整个产品安全工作流程整合到一个专用平台中,保持构建的互联产品的网络安全和网络合规性

Cybellum将 整个产品安全工作流程 整合到一个专用平台中 使设备制造商能够 保持他们构建的互联产品的 网络安全和网络合规性 产品安全性对 每个人来说都不一样 每个行业的系统、工作流程和 法规都存在根本差异 因此&#xff0c;Cybellum量身定制了 Cybellum的平台和技…

如何看待程序员领域内的“内卷”现象?

要搞清楚这个问题&#xff0c;我首先就来阐释一下“内卷”的概念。 内卷本身是从一个学术名词演化为网络流行词的&#xff0c;本是指文化模式因达到某种最终形态&#xff0c;既无法保持稳定也不能转化为更高级的新形态&#xff0c;而只能在这种文化模式内部无限变得复杂的现象。…

Linux wait函数用法

wait 函数是用于等待子进程结束并获取子进程的终止状态的系统调用。它在父进程中使用&#xff0c;用于等待其子进程终止并获得子进程的退出状态。 函数原型&#xff1a; pid_t wait(int *status);status 是一个指向整型的指针&#xff0c;用于存储子进程终止时的退出状态&…

Redis 与其他数据库的不同之处 | Navicat

Redis&#xff0c;即远程字典服务器&#xff08;Remote Dictionary Server&#xff09;&#xff0c;它是一个多功能且高性能的键值存储系统&#xff0c;在数据库领域中已获得广泛关注和认可。在处理简单数据结构方面&#xff0c;它因其快速和高效而著称。本文中&#xff0c;我们…

使用 millis() 函数作为延迟的替代方法(电位器控制延迟时间)

接线图&#xff1a; 代码&#xff1a; unsigned long currentMillis 0; unsigned long previousMillis_LED1 0; unsigned long LED1_delay0; unsigned long previousMillis_LED2 0; unsigned long LED2_delay0; #define LED1 3 #define LED2 9 #define P1 A2 …

泛型边界的问题

作者简介&#xff1a;大家好&#xff0c;我是smart哥&#xff0c;前中兴通讯、美团架构师&#xff0c;现某互联网公司CTO 联系qq&#xff1a;184480602&#xff0c;加我进群&#xff0c;大家一起学习&#xff0c;一起进步&#xff0c;一起对抗互联网寒冬 我们花了两篇文章讲述了…

基于SSM的课程辅助教学平台的设计与实现

末尾获取源码 开发语言&#xff1a;Java Java开发工具&#xff1a;JDK1.8 后端框架&#xff1a;SSM 前端&#xff1a;Vue 数据库&#xff1a;MySQL5.7和Navicat管理工具结合 服务器&#xff1a;Tomcat8.5 开发软件&#xff1a;IDEA / Eclipse 是否Maven项目&#xff1a;是 目录…