动态el-form表单以及动态禁用

当右侧下拉框选中为 长期有效,那么左侧输入框为禁用状态;
<el-form-item label="证明有效期" class="is-required"><div v-for="(item,index) in form.arrayDat" :key="index" style="width: 100%;display: flex;justify-content: space-between;"><div style="width: 85%;display: flex;justify-content: space-between;margin-bottom: 20px"><el-form-item style="width: 40%" :prop="'arrayDat.'+index+'.count'" :rules="[{required: true,message:'请输入',trigger: 'blur'}]"><el-input v-model="item.count" placeholder="请输入" :disabled="item.flag"/></el-form-item><el-form-item style="width: 50%" :prop="'arrayDat.'+index+'.deadline'" :rules="[{required: true,message:'请选择',trigger: 'change'}]"><el-select v-model="item.deadline" placeholder="请选择" @change="validChange"><el-option v-for="dict in prove_deadline" :key="dict.value" :label="dict.label":value="dict.value"></el-option></el-select></el-form-item></div><div style="width: 8%;display: flex;"><el-button icon="Plus" type="text" @click="add"></el-button><div class="del" v-if="form.arrayDat.length > 1"><el-button icon="Minus" type="text" @click="del(index)"></el-button></div></div></div></el-form-item>
const data = reactive({form: {// 新增行arrayDat: [{count:'',deadline:'',flag: false}]},
})
const { form } = toRefs(data);
核心:
const validChange = (val) => {for (let i = 0; i < form.value.arrayDat.length; i++) {// 如果当前元素的 deadline 值为 3if (form.value.arrayDat[i].deadline == '3') {// 将对应的 flag 输入框设置为禁用状态form.value.arrayDat[i].flag = true;} else {// 否则设置为启用状态form.value.arrayDat[i].flag = false;}}console.log(form.value.arrayDat,'@@@')
}
相关文章:
动态el-form表单以及动态禁用
当右侧下拉框选中为 长期有效,那么左侧输入框为禁用状态; <el-form-item label"证明有效期" class"is-required"><div v-for"(item,index) in form.arrayDat" :key"index" style"width: 100%;display: flex;justify-co…...
【Web后端】web后端开发简介_Servlet简介
1.web后端开发简介 Java企业级开发,也就是学习]avaEE(Enterprise Edition)版本,是一种结构和一套标准。在应用中开发的标准就是Servlet、jsp和JavaBean技术。jsp技术现在已基本处于淘汰状态,简单了解即可web后端开发,基于B/S模式的开发体系。…...
Taylor Francis科技期刊数据库文献去哪里获取
一、Taylor & Francis科技期刊数据库简介: Taylor & Francis 科技期刊数据库(T&F ST Library)提供超过520种经专家评审的高质量科学与技术类期刊, 其中超过85%的期刊被Web of Science收录,内容最早至1997年。该科技期…...
C#学习笔记12:Winform网页操作-CefSharp内嵌浏览器
今日学习使用Winform操作网页,先从从窗体内嵌一个浏览器开始吧: 文章提供测试代码讲解、测试效果图、整体测试工程下载 目录 CefSharp介绍与安装: 创建解决方案安装CefSharp: 控件放置: 整体代码贴出: 更改…...
NSSCTF | [SWPUCTF 2021 新生赛]babyrce
打开题目,显示了一个php脚本 我们来分析一下这个脚本是什么意思 <?php error_reporting(0); header("Content-Type:text/html;charsetutf-8"); highlight_file(__FILE__); if($_COOKIE[admin]1) {include "../next.php"; } elseecho &quo…...
环保不只是口号,绿葆自助取袋机助力1000多家医院环保行动!
2023年1月1日起,国家的“限塑令”范围进一步扩大,2023年6月20日起,《商务领域经营者使用、报告一次性塑料制品管理办法》开始实施。从国家到地方,对一次性塑料制品的污染问题治理正在越来越严格。为了响应国家环保政策并为患者提供…...
DELL服务器配置ILO(idrac)地址、修改管理员密码
服务器型号:DELL PowerEdge R630 1、重启服务器选择F2进入BIOS 2、重启服务器选择F2进入BIOS 3、选择“Network” 4、配置iDRAC的IP,掩码网关,DNS等信息 5、Esc返回,下滑选择“User Configuration” 6、配置iDRAC的用户名密码以及…...
如何打造个人IP?
打造个人IP(Intellectual Property)是当今社会中越来越受到关注的话题。个人IP指的是个人在某个领域内所拥有的独特的、具有商业价值的知识、技能、品牌和影响力。为什么要打造个人IP?如何打造个人IP?下面我将为您详细解答。 首先…...
【PostgreSQL支持中文的全文检索插件(zhparser)】
PostgreSQL本身是支持全文检索的,提供两个数据类型(tsvector,tsquery),并且通过动态检索自然语言文档的集合,定位到最匹配的查询结果。其内置的默认的分词解析器采用空格进行分词,但是因为中文的词语之间没…...
SHAP分析交互作用的功能,如果你用的模型是xgboost
SHAP分析交互作用的功能,如果你用的模型是xgboost 如果在SHAP分析中使用的是xgoost模型,就可以使用SHAP分析内置的交互作用分析,为分析变量间的相互提供了另外一个观察的视角。关于SHAP交互作用分析,一个参考资料,还是…...
瑞友科技质量改进服务事业部总经理张力受邀为第十三届中国PMO大会演讲嘉宾
全国PMO专业人士年度盛会 北京瑞友科技股份有限公司质量改进服务事业部总经理张力先生受邀为PMO评论主办的2024第十三届中国PMO大会演讲嘉宾,演讲议题为“PMO如何对接战略成为企业IT投资成功的有效保障”。大会将于6月29-30日在北京举办,敬请关注&#x…...
CVE-2024-4761 Chrome 的 JavaScript 引擎 V8 中的“越界写入”缺陷
分析 CVE-2024-4761 和 POC 代码 CVE-2024-4761 描述 CVE-2024-4761 是一个在 V8 引擎中发现的越界写漏洞,报告日期为 2024-05-09。这个漏洞可能允许攻击者通过特制的代码执行任意代码或者造成内存破坏,进而导致程序崩溃或其他不安全行为。 POC 代码解…...
字符串函数(二):strlen(求长度),strstr(查找子串),strtok(分割),strerror(打印错误信息)
字符串函数 一.strlen(求字符串长度)1.函数使用2.模拟实现(三种方法) 二.strstr(字符串查找子串)1.函数使用2.模拟实现 三.strtok(字符串分割)四.strerror,perror&#x…...
EUCR-30S电机保护器施耐德EOCR
EOCR主要产品有电子式电动机保护继电器,电子式过电流继电器,电子式欠电流继电器,电子式欠电压继电器,其它保护和监视装置,电流互感器。 电器密集型设计 ■ 二个集成组装电流互感器 ■ 欠载保护(空转保护…...
人工神经网络(科普)
人工神经网络(Artificial Neural Network,即ANN ),是20世纪80 年代以来人工智能领域兴起的研究热点。它从信息处理角度对人脑神经元网络进行抽象, 建立某种简单模型,按不同的连接方式组成不同的网络。在工程…...
宇宙(科普)
宇宙(Universe)在物理意义上被定义为所有的空间和时间(统称为时空)及其内涵,包括各种形式的所有能量,比如电磁辐射、普通物质、暗物质、暗能量等,其中普通物质包括行星、卫星、恒星、星系、星系…...
安防视频/视频汇聚系统EasyCVR视频融合云平台助力智能化酒店安防体系的搭建
一、背景需求 2024年“五一”假期,全国文化和旅游市场总体平稳有序。文化和旅游部6日发布数据显示,据文化和旅游部数据中心测算,全国国内旅游出游合计2.95亿人次。“五一”假期县域市场酒店预订订单同比增长68%,而酒店作为一个高…...
SpringCloudAlibaba:5.1Sentinel的基本使用
概述 简介 Sentinel是阿里开源的项目,提供了流量控制、熔断降级、系统负载保护等多个维度来保障服务之间的稳定性。 官网 https://sentinelguard.io/zh-cn/ Sentinel的历史 2012 年,Sentinel 诞生,主要功能为入口流量控制。 2013-2017 年…...
SHELL-双重循环习题练习
1.99乘法表 #!/bin/bash #99乘法表for ((second1; second<9; second)) dofor ((first1; first<second; first))do echo -n -e "${first}*${second}$[first*second]\t" done echo done ######### 首先定义了一个外循环变量second,初始值为1&am…...
2024年为什么很多电商商家,都想涌入视频号,究竟是什么原因?
大家好,我是电商糖果 对电商有了解的朋友,在今年肯定发现一个现象,那就是很多商家对视频号比较青睐。 视频号究竟有何魔力,让越来越多的商家都想要入驻。 其实很简单,它让商家看到了市场。 视频号背后是谁…...
MongoDB学习和应用(高效的非关系型数据库)
一丶 MongoDB简介 对于社交类软件的功能,我们需要对它的功能特点进行分析: 数据量会随着用户数增大而增大读多写少价值较低非好友看不到其动态信息地理位置的查询… 针对以上特点进行分析各大存储工具: mysql:关系型数据库&am…...
蓝桥杯 2024 15届国赛 A组 儿童节快乐
P10576 [蓝桥杯 2024 国 A] 儿童节快乐 题目描述 五彩斑斓的气球在蓝天下悠然飘荡,轻快的音乐在耳边持续回荡,小朋友们手牵着手一同畅快欢笑。在这样一片安乐祥和的氛围下,六一来了。 今天是六一儿童节,小蓝老师为了让大家在节…...
STM32F4基本定时器使用和原理详解
STM32F4基本定时器使用和原理详解 前言如何确定定时器挂载在哪条时钟线上配置及使用方法参数配置PrescalerCounter ModeCounter Periodauto-reload preloadTrigger Event Selection 中断配置生成的代码及使用方法初始化代码基本定时器触发DCA或者ADC的代码讲解中断代码定时启动…...
ESP32 I2S音频总线学习笔记(四): INMP441采集音频并实时播放
简介 前面两期文章我们介绍了I2S的读取和写入,一个是通过INMP441麦克风模块采集音频,一个是通过PCM5102A模块播放音频,那如果我们将两者结合起来,将麦克风采集到的音频通过PCM5102A播放,是不是就可以做一个扩音器了呢…...
spring:实例工厂方法获取bean
spring处理使用静态工厂方法获取bean实例,也可以通过实例工厂方法获取bean实例。 实例工厂方法步骤如下: 定义实例工厂类(Java代码),定义实例工厂(xml),定义调用实例工厂ÿ…...
【RockeMQ】第2节|RocketMQ快速实战以及核⼼概念详解(二)
升级Dledger高可用集群 一、主从架构的不足与Dledger的定位 主从架构缺陷 数据备份依赖Slave节点,但无自动故障转移能力,Master宕机后需人工切换,期间消息可能无法读取。Slave仅存储数据,无法主动升级为Master响应请求ÿ…...
今日学习:Spring线程池|并发修改异常|链路丢失|登录续期|VIP过期策略|数值类缓存
文章目录 优雅版线程池ThreadPoolTaskExecutor和ThreadPoolTaskExecutor的装饰器并发修改异常并发修改异常简介实现机制设计原因及意义 使用线程池造成的链路丢失问题线程池导致的链路丢失问题发生原因 常见解决方法更好的解决方法设计精妙之处 登录续期登录续期常见实现方式特…...
MySQL 知识小结(一)
一、my.cnf配置详解 我们知道安装MySQL有两种方式来安装咱们的MySQL数据库,分别是二进制安装编译数据库或者使用三方yum来进行安装,第三方yum的安装相对于二进制压缩包的安装更快捷,但是文件存放起来数据比较冗余,用二进制能够更好管理咱们M…...
Caliper 配置文件解析:fisco-bcos.json
config.yaml 文件 config.yaml 是 Caliper 的主配置文件,通常包含以下内容: test:name: fisco-bcos-test # 测试名称description: Performance test of FISCO-BCOS # 测试描述workers:type: local # 工作进程类型number: 5 # 工作进程数量monitor:type: - docker- pro…...
GraphQL 实战篇:Apollo Client 配置与缓存
GraphQL 实战篇:Apollo Client 配置与缓存 上一篇:GraphQL 入门篇:基础查询语法 依旧和上一篇的笔记一样,主实操,没啥过多的细节讲解,代码具体在: https://github.com/GoldenaArcher/graphql…...
