当前位置: 首页 > news >正文

form中表单切换,导致 relus 中的事件无法触发,原因:页面切换不要一直切换DOM,会导致问题,需要都显示出来

修改前,因为重复渲染DOM导致绑定rules失效

在这里插入图片描述

修改前代码使用 computed 计算出渲染的DOM,影响rules事件<el-formref="form"inline:model="billDetailCopy":rules="rules"size="small"label-position="right"label-width="110px"class="addInvoice-content-input"><el-row><el-form-item v-for="(item,index) in filter(ordinaryList)" :key="index" :prop="item.key" :label="item.label" ><el-form-item/><el-form/> 

修改后,将切换的DOM使用v-show都渲染在页面,不会让rules错乱。

在这里插入图片描述

修改后各渲染各的
<el-formv-show="billDetailCopy.type === '增值税普通发票'"ref="form1"inline:model="billDetailCopy":rules="rules"size="small"label-position="right"label-width="110px"class="addInvoice-content-input"><el-row><el-form-item v-for="(item,index) in ordinaryList" :key="index" :prop="item.key" :label="item.label" ><el-form-item/><el-form/> 

form 中绑定的 rules 跟两个元素有关,才能触发rules绑定的每一个事件

1、 <el-form-item 绑定的 prop=“aaa” 在 rules中

2、v-model=“aaa” 绑定的 aaa 在 rules 中

参考链接

相关文章:

form中表单切换,导致 relus 中的事件无法触发,原因:页面切换不要一直切换DOM,会导致问题,需要都显示出来

修改前&#xff0c;因为重复渲染DOM导致绑定rules失效 修改前代码使用 computed 计算出渲染的DOM&#xff0c;影响rules事件<el-formref"form"inline:model"billDetailCopy":rules"rules"size"small"label-position"right&quo…...

Android Ble蓝牙App(五)数据操作

Ble蓝牙App&#xff08;五&#xff09;数据操作 前言正文一、操作内容处理二、读取数据① 概念② 实操 三、写入数据① 概念② 实操 四、打开通知一、概念二、实操三、收到数据 五、源码 前言 关于低功耗蓝牙的服务、特性、属性、描述符都已经讲清楚了&#xff0c;而下面就是使…...

.netcore grpc双向流方法详解

一、双向流处理概述 简单来讲客户端可以向服务端发送消息流&#xff0c;服务端也可以向客户端传输响应流&#xff0c;即客户端和服务端可以互相通讯客户端无需发送消息即可开始双向流式处理调用 。 客户端可选择使用 RequestStream.WriteAsync 发送消息。 使用 ResponseStream…...

【Servlet】(Servlet API HttpServlet 处理请求 HttpServletRequest 打印请求信息 前端给后端传参)

文章目录 Servlet APIHttpServlet处理请求 HttpServletRequest打印请求信息前端给后端传参 Servlet API Servlet中常用的API HttpServlet 实际开发的时候主要重写 doXXX 方法, 很少会重写 init / destory / service destory 服务器终止的时候会调用. //下面的注解把当前类和…...

java中右移>>和无符号右移>>>的区别

public static void main(String[] args) {byte[] dest new byte[2];dest[0] 0x15; //0001 0101dest[1] (byte) 0xfb;//1111 1011System.out.println((dest[0] >> 4) & 0xff);//右移 应该是0000 0001 十进制结果显示1 结果也是1&#xff0c;正确System.out.printl…...

牛客周赛 Round 7

目录 A 游游的you矩阵 题目&#xff1a; 题解&#xff1a; AC 代码&#xff1a; B 游游的01串操作 题目&#xff1a; 题解&#xff1a; AC 代码&#xff1a; C 游游的正整数 题目&#xff1a; 题解&#xff1a; AC 代码&#xff1a; D 游游的选数乘积 题目&#xf…...

R语言生存分析(机器学习)(1)——GBM(梯度提升机)

GBM是一种集成学习算法&#xff0c;它结合了多个弱学习器&#xff08;通常是决策树&#xff09;来构建一个强大的预测模型。GBM使用“Boosting”的技术来训练弱学习器&#xff0c;这种技术是一个迭代的过程&#xff0c;每一轮都会关注之前轮次中预测效果较差的样本&#xff0c;…...

k8s和docker简单介绍

当涉及到容器技术和容器编排时&#xff0c;Docker和Kubernetes是两个重要的概念。我将更详细地介绍它们以及它们之间的关系。 Docker&#xff1a; Docker是一种容器化技术&#xff0c;它允许你将应用程序及其依赖项打包到一个称为"容器"的封闭环境中。每个容器都包…...

Lua学习记录

Lua基础了解 Lua的注释通过 (-- 单行注释&#xff0c;--[[ ]] 多行注释)可以不加&#xff1b; 多个变量赋值&#xff0c;按顺序赋值&#xff0c;没有则为nil&#xff1b; function的简单用法&#xff0c;多个返回值配合多重赋值&#xff0c;以end为结束标志 Lua下标从1开始&…...

三分钟完美解决你的C盘内存过大爆红

一、清理回收站 二、清理桌面 建议一 不要在桌面放太多图标或者文件会占用过多的内存,可以放到其他盘建议二、 将位置移动到别的盘 三、手动删除下载文件与缓存文件 日常使用中会通过Windows下载各种文件资料到电脑中&#xff0c;它默认也是直接下载在C盘中的。如果我们在以…...

C++ - equal(比较两个vector元素)

C标准库的std::equal函数。这个函数用于比较两个范围的元素是否相等。 在使用std::equal函数时&#xff0c;您需要提供两个范围的迭代器&#xff0c;以及一个可选的谓词函数&#xff08;predicate&#xff09;。函数会比较第一个范围内的元素和第二个范围内的元素是否相等。如果…...

多线程:线程池

线程池 提前创建多个线程放入线程池中&#xff0c;使用时直接获取&#xff0c;使用完直接放入池中&#xff1b;可以避免频繁创建销毁&#xff0c;实现重复利用&#xff0c;类似生活中的公共交通工具。好处&#xff1a;提高相应速度&#xff1b;降低资源消耗&#xff1b;便于线…...

9.3.2.2网络原理(传输层TCP)

TCP全部细节参考RFC标准文档 一.TCP特点: 有连接,可靠传输,面向字节流,全双工. 二.TCP数据报: 1.端口号是传输层的重要概念. 2.TCP的报头是变长的(UDP是固定的8字节),大小存在4位首部长度中,用4个bit位(0~15)表示长度单位是4字节.(TCP报头最大长度是60字节,前面20字节是固定…...

ssm+mybatis无法给带有下划线属性赋值问题

原因&#xff1a;mybaitis根据配置&#xff0c;将有下划线的字段名改为了驼峰格式。 具体见&#xff1a;ssmmybatis无法给带有下划线属性赋值问题&#xff0c;无法获取数据库带下划线的字段值 - 开发者博客 解决方式&#xff1a; 直接将实体类中的下划线去掉返回值使用resul…...

学习笔记-JVM监控平台搭建

SpringBoot Actuator 1 引入依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-actuator</artifactId> </dependency>2 开启配置 # 暴露所有的监控点【含Prometheus】 management.endpoin…...

使用css实现时间线布局(TimeLine)

前言 在使用uni-app开发微信小程序过程中&#xff0c;遇到了时间轴布局&#xff0c;由于每项的内容高度不一致&#xff0c;使用uniapp自带的扩展组件uni-steps&#xff0c;样式布局无法对齐竖线&#xff0c;于是自己造轮子&#xff0c;完成特殊的布局。显示效果如下&#xff1…...

深入浅出 栈和队列(附加循环队列、双端队列)

栈和队列 一、栈 概念与特性二、Stack 集合类及模拟实现1、Java集合中的 Stack2、Stack 模拟实现 三、栈、虚拟机栈、栈帧有什么区别&#xff1f;四、队列 概念与特性五、Queue集合类及模拟实现1、Queue的底层结构&#xff08;1&#xff09;顺序结构&#xff08;2&#xff09;链…...

前端基础(二)

前言&#xff1a;前端开发框架——Vue框架学习。 准备工作&#xff1a;添加Vue devtools扩展工具 具体可查看下面的这篇博客 添加vue devtools扩展工具添加后F12不显示Vue图标_MRJJ_9的博客-CSDN博客 Vue官方学习文档 Vue.js - 渐进式 JavaScript 框架 | Vue.js MVVM M…...

ORB-SLAM2学习笔记7之System主类和多线程

文章目录 0 引言1 整体框架1.1 整体流程 2 System主类2.1 成员函数2.2 成员变量 3 多线程3.1 ORB-SLAM2中的多线程3.2 加锁 0 引言 ORB-SLAM2是一种基于特征的视觉SLAM&#xff08;Simultaneous Localization and Mapping&#xff09;系统&#xff0c;它能够从单个、双目或RBG…...

gin的占位符:和通配符*

1、用法 在 Gin 路由中&#xff0c;可以使用一个通配符&#xff08;*&#xff09;或一个占位符&#xff08;:&#xff09;来捕获 URL 的一部分。 r.GET("/royal/:id", func(c *gin.Context) {id : c.Param("id")//fmt.Println("into :id")c.Str…...

从USB转TTL接线到手机热点配网:ESP8266无线通信保姆级避坑指南(附软件包)

从USB转TTL接线到手机热点配网&#xff1a;ESP8266无线通信保姆级避坑指南 当你第一次拿起ESP8266模块时&#xff0c;可能会被这个小巧的Wi-Fi模块惊艳到——它只有指甲盖大小&#xff0c;却蕴含着强大的无线通信能力。但很快&#xff0c;这种惊艳就会变成困惑&#xff1a;为什…...

艾尔登法环帧率解锁终极指南:告别卡顿,畅享丝滑游戏体验

艾尔登法环帧率解锁终极指南&#xff1a;告别卡顿&#xff0c;畅享丝滑游戏体验 【免费下载链接】EldenRingFpsUnlockAndMore A small utility to remove frame rate limit, change FOV, add widescreen support and more for Elden Ring 项目地址: https://gitcode.com/gh_m…...

如何在macOS上免费解锁QQ音乐加密文件:完整指南

如何在macOS上免费解锁QQ音乐加密文件&#xff1a;完整指南 【免费下载链接】QMCDecode QQ音乐QMC格式转换为普通格式(qmcflac转flac&#xff0c;qmc0,qmc3转mp3, mflac,mflac0等转flac)&#xff0c;仅支持macOS&#xff0c;可自动识别到QQ音乐下载目录&#xff0c;默认转换结果…...

录音会议纪要整理不同使用场景,实用口碑选择建议

针对不同场景的录音整理需求&#xff08;短录音、中长录音、长内容深度整理&#xff09;&#xff0c;本文基于实际使用体验&#xff0c;分享不同场景下的工具选择建议与使用心得。一、场景一&#xff1a;短录音&#xff08;15-60分钟&#xff0c;发音清晰&#xff09;典型场景&…...

FM3773 低功耗离线式恒流/恒压 PSR 控制器

概述 FM3773 是一种高性能的交流/直流用于电池充电器和适配器的电源控制器&#xff0c;内置 850V 功率三极管。该设备采用脉冲频率调制&#xff08;PFM&#xff09;的方法来建立非连续导通模式&#xff08;DCM&#xff09;反激式电源。 FM3773 提供精确的恒定电压&#xff0c;恒…...

告别鼠标手!5分钟上手开源鼠标连点器MouseClick,轻松实现自动化点击

告别鼠标手&#xff01;5分钟上手开源鼠标连点器MouseClick&#xff0c;轻松实现自动化点击 【免费下载链接】MouseClick &#x1f5b1;️ MouseClick &#x1f5b1;️ 是一款功能强大的鼠标连点器和管理工具&#xff0c;采用 QT Widget 开发 &#xff0c;具备跨平台兼容性 。软…...

基于ESP32的智能电池充电器设计:多化学体系支持与模块化架构

1. 项目概述&#xff1a;打造一台全能的“电池医生”手头攒了一堆不同化学体系的电池&#xff0c;从航模用的4S锂聚合物电池&#xff0c;到应急灯里的12V铅酸电池&#xff0c;再到各种工具里的镍氢、锂离子电池&#xff0c;每次充电都得翻出好几个不同的充电器&#xff0c;桌面…...

LizzieYzy:你的智能围棋教练,让AI分析变得简单有趣 [特殊字符]

LizzieYzy&#xff1a;你的智能围棋教练&#xff0c;让AI分析变得简单有趣 &#x1f3af; 【免费下载链接】lizzieyzy LizzieYzy - GUI for Game of Go 项目地址: https://gitcode.com/gh_mirrors/li/lizzieyzy 还在为复盘找不到关键点而烦恼吗&#xff1f;想提升棋力却…...

浏览器指纹识别机制深度剖析与反识别技术实现

一、浏览器指纹技术基础认知1.1 浏览器指纹的核心定义在数字化时代&#xff0c;每一台接入互联网的设备都会留下独特的数字标识&#xff0c;浏览器指纹便是其中最关键的识别凭证之一。浏览器指纹是网站通过 JavaScript 脚本、HTTP 请求头、硬件接口调用等多种技术手段&#xff…...

保姆级教程:在Windows 10上用QEMU+Kylin搭建可内外网访问的完整开发环境

在Windows 10上构建QEMUKylin全功能开发环境的终极指南当开发者需要在本地快速搭建一个隔离的国产操作系统开发环境时&#xff0c;QEMU虚拟化方案配合银河麒麟系统能提供高度灵活的沙箱体验。本文将手把手带你完成从零配置到内外网联通的完整工作流&#xff0c;涵盖虚拟化环境部…...