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

elementUI如何动态增减表单项

设置prop的字段::prop="configs.${i}.platform"

<template><el-dialogtitle="编辑配置":close-on-click-modal="false":before-close="beforeClose":visible.sync="visible"v-if="visible"class="abow_dialog"><el-form:model="dataForm":rules="dataRule"ref="dataForm"@keyup.enter.native="dataFormSubmit()"label-width="140px"><el-form-item label="医院名称" prop="hospname"><el-inputv-model="dataForm.hospname"placeholder="输入医院名称"disabled></el-input></el-form-item><el-form-item label="互联网医院名称" prop="internetHospname"><el-inputv-model="dataForm.internetHospname"placeholder="输入互联网医院名称"></el-input></el-form-item><el-form-item label="数据来源" prop="internetBuilder"><el-selectv-model="dataForm.internetBuilder"placeholder="请选择数据来源"><el-option label="纳里" value="1"></el-option><el-option label="院方" value="2"></el-option><el-option label="自建" value="3"></el-option></el-select></el-form-item><div v-for="(item, i) in dataForm.configs" :key="i" class="area1"><!-- <div>序列{{ i + 1 }}</div> --><el-form-itemlabel="发布平台":prop="`configs.${i}.platform`":rules="{required: true,message: '发布平台不能为空',trigger: 'blur',}"><el-selectv-model="item.platform"placeholder="请选择发布平台"><el-optionv-for="itemC in channelList":key="itemC.typeKey":label="itemC.typeValue":value="itemC.typeKey"></el-option></el-select><!-- 增加 --><el-buttontype="primary"icon="el-icon-plus"size="small"v-show="i == 0"@click="addGLSetting"class="addDelBtn"></el-button><el-button@click="deleteGLSetting(item, i)"type="danger"size="small"icon="el-icon-minus"v-show="i == 0"></el-button><!-- 删除 --><el-button@click="deleteGLSetting(item, i)"type="danger"size="small"icon="el-icon-minus"class="addDelBtn"v-show="i != 0"></el-button></el-form-item><el-form-item label="应用类别" :prop="`configs.${i}.jumpType`"><el-select v-model="item.jumpType" placeholder="请选择"><el-optionv-for="item1 in appTypeList":key="item1.typeKey":label="item1.typeValue":value="item1.typeKey"></el-option></el-select></el-form-item><el-form-itemlabel="小程序appId":prop="`configs.${i}.jumpMiniId`"v-if="item.jumpType === '3'"><el-inputv-model="item.jumpMiniId"placeholder="输入小程序appId"></el-input></el-form-item><el-form-item label="跳转地址" :prop="`configs.${i}.jumpH5Url`"><el-inputv-model="item.jumpH5Url"placeholder="输入跳转地址"></el-input></el-form-item><el-form-item label="排序" :prop="`configs.${i}.sort`"><el-input v-model.number="item.sort"></el-input></el-form-item><el-form-item label="状态" :prop="`configs.${i}.status`"><el-selectv-model="item.status"placeholder="请选择是否有效"clearable><el-optionv-for="item2 in effective":key="item2.typeKey":label="item2.typeValue":value="item2.typeKey"></el-option></el-select></el-form-item></div><el-form-item><el-button @click="handleClose">取消</el-button><el-button type="primary" @click="dataFormSubmit()">保存</el-button></el-form-item></el-form></el-dialog>
</template>

相关文章:

elementUI如何动态增减表单项

设置prop的字段&#xff1a;:prop"configs.${i}.platform" <template><el-dialogtitle"编辑配置":close-on-click-modal"false":before-close"beforeClose":visible.sync"visible"v-if"visible"class&q…...

【iOS】源码阅读(四)——isa与类关联的原理

文章目录 前言OC对象本质探索clang探索对象本质objc_setProperty源码探索 cls与类的关联原理为什么说bits与cls为互斥关系isa的类型isa_t原理探索isa与类的关联 总结 前言 本篇文章主要是笔者在学习和理解类与isa的关联关系时所写的笔记。 OC对象本质探索 在学习和理解类与isa…...

sql server 2019 将单用户状态修改为多用户状态

记录两种将单用户状态修改为多用户状态&#xff0c;我曾经成功过的方法&#xff0c;供参考 第一种方法 USE master; GO -- 终止所有活动连接 DECLARE kill_connections NVARCHAR(MAX) ; SELECT kill_connections KILL CAST(session_id AS NVARCHAR(10)) ; FROM sys.dm_ex…...

uniapp引入七鱼客服微信小程序SDK

小程序引入七鱼sdk 1.微信公众平台引入2.代码引入3.在pagesQiyu.vue初始化企业appKey4.跳转打开七鱼客服 1.微信公众平台引入 账号设置->第三方设置->添加插件->搜索 QIYUSDK ->添加 2.代码引入 在分包中引入插件 "subPackages": [{"root":…...

uniapp 常用 UI 组件库

1. uView UI 特点&#xff1a; 组件丰富&#xff1a;提供覆盖按钮、表单、图标、表格、导航、图表等场景的内置组件。跨平台支持&#xff1a;兼容 App、H5、小程序等多端。高度可定制&#xff1a;支持主题定制&#xff0c;组件样式灵活。实用工具类&#xff1a;提供时间、数组操…...

SCI写作开挂!把Grammarly语法修订嵌入word

详细分享如何把Grammarly嵌入Word&#xff0c;实现英文写作时的实时语法校改。 ①进入Grammarly官网 ②点击右上角的“Get Grammarly Its free”会直接跳转到注册或者登录界面&#xff0c;如果还没有账号先注册。 ③注册或登录后进入这个页面&#xff0c;点击“Support”。 ④…...

PostgreSQL 配置设置函数

PostgreSQL 配置设置函数 PostgreSQL 提供了一组配置设置函数&#xff08;Configuration Settings Functions&#xff09;&#xff0c;用于查询和修改数据库服务器的运行时配置参数。这些函数为数据库管理员提供了动态管理数据库配置的能力&#xff0c;无需重启数据库服务。 …...

2025年5月-信息系统项目管理师高级-软考高项-成本计算题

成本计算题挣值分析、成本计算题如何学?1、PV&#xff0c;EV&#xff0c;AC需要理解&#xff0c;根据题目给出的一些个条件需要求得这些值;2、CV&#xff0c;SV&#xff0c;CPI&#xff0c;SPI公式必须记住&#xff0c;需要根据求得的值判断项目的进度和成本的执行情况&#x…...

力扣-236.二叉树的最近公共祖先

题目描述 给定一个二叉树, 找到该树中两个指定节点的最近公共祖先。 百度百科中最近公共祖先的定义为&#xff1a;“对于有根树 T 的两个节点 p、q&#xff0c;最近公共祖先表示为一个节点 x&#xff0c;满足 x 是 p、q 的祖先且 x 的深度尽可能大&#xff08;一个节点也可以…...

Go 中闭包的常见使用场景

在 Go 中&#xff0c;闭包&#xff08;Closure&#xff09; 是一个函数值&#xff0c;它引用了其定义时所在作用域中的变量。也就是说&#xff0c;闭包可以访问并修改外部作用域中的变量。 Go 中闭包的常见使用场景 ✅ 1. 封装状态&#xff08;无须结构体&#xff09; 闭包可…...

SpringBoot中的Lombok库

一&#xff09;Lombok库简介 Lombok是一个Java库&#xff0c;通过注解的方式简化代码编写&#xff0c;减少样板代码。它能够自动生成getter、setter、构造函数、toString等方法&#xff0c;提升开发效率。Lombok只是一个编译阶段的库&#xff0c;因此不会影响程序的运行。 二…...

《Java 大视界——Java 大数据在智能电网分布式能源协同调度中的应用与挑战》

随着风电、光伏等分布式能源大规模接入电网&#xff0c;传统调度系统面临数据规模激增、响应延迟显著、多源异构数据融合困难等核心问题。本文聚焦Java生态下的大数据技术体系&#xff0c;深入探讨其在智能电网实时监测、负荷预测、资源优化配置等场景中的落地实践。通过分析Sp…...

AI中的MCP是什么?MCP的作用及未来方向预测 (使用go-zero 快速搭建MCP服务器)

AI是当下最热的风。在当今AI技术飞速发展的时代&#xff0c;AI的应用已经渗透到我们日常生活的方方面面。然而&#xff0c;随着AI系统的复杂性不断增加&#xff0c;如何让AI具备更强的自主性和灵活性成为了业界关注的焦点。这就引出了Model Context Protocol&#xff08;MCP&am…...

mac安装cast

背景 pycharm本地运行脚本时提示cast没有安装 问题原因 脚本尝试调用cast命令&#xff08;以太坊开发工具foundry中的子命令&#xff09;&#xff0c;但您的系统未安装该工具。 从日志可见&#xff0c;错误发生在通过sysutil.py执行shell命令时。 解决方案 方法1&#xf…...

conda更换清华源

1、概览 anaconda更换速度更快、更稳定的下载源&#xff0c;在linux环境测试通过。 2、conda源查看 在修改之前可以查看下现有conda源是什么&#xff0c;查看conda配置信息&#xff0c;如下&#xff1a; cat ~/.condarc 可以看到你的conda源&#xff0c;以我的conda源举例&am…...

[原创](现代Delphi 12指南):[macOS 64bit App开发]: 注意“回车换行“的跨平台使用.

[作者] 常用网名: 猪头三 出生日期: 1981.XX.XX 企鹅交流: 643439947 个人网站: 80x86汇编小站 编程生涯: 2001年~至今[共24年] 职业生涯: 22年 开发语言: C/C++、80x86ASM、Object Pascal、Objective-C、C#、R、Python、PHP、Perl、 开发工具: Visual Studio、Delphi、XCode、…...

管理Oracle Data Guard的最佳实践

Oracle Data Guard的中文名字叫数据卫士&#xff0c;顾名思义&#xff0c;它是生产库的一道保障。所以管理Data Guard是DBA的一项重要工作之一&#xff0c;管理Data Guard时主要有以下几个注意点需要引起重视。 备份库的归档日志积压 一般情况下&#xff0c;生产库的归档日志是…...

一个简单点的js的h5页面实现地铁快跑的小游戏

以下是一个简化版的"地铁快跑"小游戏H5页面实现。这个游戏包含基本的角色跳跃、障碍物生成和计分系统&#xff0c;使用Canvas绘图技术实现。 完整源码 登录后复制 <!DOCTYPE html> <html lang"zh-CN"> <head><meta charset"UTF-…...

作业帮Java后台开发面试题及参考答案(下)

final、finally、finalize 的区别是什么? final、finally和finalize是 Java 中三个功能完全不同的关键字,容易混淆,需从作用域、语法规则和实际用途等方面深入区分。 final的作用 final用于修饰类、方法和变量,体现 “不可变” 特性: 修饰类:表示该类不能被继承,例如 J…...

Hugging Face 中 LeRobot 使用的入门指南

相关源文件 .github/ISSUE_TEMPLATE/bug-report.yml .github/PULL_REQUEST_TEMPLATE.md README.md examples/1_load_lerobot_dataset.py examples/2_evaluate_pretrained_policy.py examples/3_train_policy.py lerobot/scripts/eval.py lerobot/scripts/train.py 本页面提供 …...

零基础入门Hadoop:IntelliJ IDEA远程连接服务器中Hadoop运行WordCount

今天我们来聊一聊大数据&#xff0c;作为一个Hadoop的新手&#xff0c;我也并不敢深入探讨复杂的底层原理。因此&#xff0c;这篇文章的重点更多是从实际操作和入门实践的角度出发&#xff0c;带领大家一起了解大数据应用的基本过程。我们将通过一个经典的案例——WordCounter&…...

HTML-3.3 表格布局(学校官网简易布局实例)

本系列可作为前端学习系列的笔记&#xff0c;代码的运行环境是在HBuilder中&#xff0c;小编会将代码复制下来&#xff0c;大家复制下来就可以练习了&#xff0c;方便大家学习。 系列文章目录 HTML-1.1 文本字体样式-字体设置、分割线、段落标签、段内回车以及特殊符号 HTML…...

Maven构建流程详解:如何正确管理微服务间的依赖关系-当依赖的模块更新后,我应该如何重新构建主项目

文章目录 一、前言二、Maven 常用命令一览三、典型场景说明四、正确的构建顺序正确做法是&#xff1a; 五、为什么不能只在 A 里执行 clean install&#xff1f;六、进阶推荐&#xff1a;使用多模块项目&#xff08;Multi-module Project&#xff09;七、总结 一、前言 在现代…...

遗传算法求解旅行商问题分析

目录 一、问题分析 二、实现步骤 1&#xff09;初始化种群 2&#xff09;计算适应度 3&#xff09;选择操作 4&#xff09;交叉操作 5&#xff09;变异操作 三、求解结果 四、总结 本文通过一个经典的旅行商问题&#xff0c;详细阐述在实际问题中如何运用遗传算法来进…...

【hot100-动态规划-300.最长递增子序列】

力扣300.最长递增子序列思路解析 本题要求在一个整数数组 nums 中,找到最长严格递增子序列的长度。子序列是指从原数组中派生而来的序列,删除(或不删除)数组中的元素而不改变其余元素的顺序。例如,[3,6,2,7] 是数组 [0,3,1,6,2,2,7] 的子序列。 动态规划思路 定义状态:…...

PostgreSQL malformed array literal异常

现象 在一个存储过程中编写如下代码&#xff08;省略与本异常无关的代码&#xff09;&#xff1a; declare hbsn_arr varchar(240)[]; #bddm.hbsn 内容类似于{"chain0":["NULL"],"chain1":["FESDF09402342","NULL"],...} …...

打造网络安全堡垒,企业如何应对DDoS、CC、XSS和ARP攻击

网站已经成为企业展示形象、开展业务和实现线上营销的重要平台。然而&#xff0c;随着网络攻击手段的不断升级&#xff0c;DDoS、CC、XSS、ARP等攻击频频出现&#xff0c;严重威胁到企业的信息安全和业务稳定。本文将详细阐述网站被攻击后应采取的应急措施及预防策略&#xff0…...

Oracle统计信息收集时的锁持有阶段

Oracle统计信息收集时的锁持有阶段 1 准备阶段&#xff08;共享模式锁&#xff09; 锁类型&#xff1a;对象级共享锁&#xff08;S锁&#xff09; 持续时间&#xff1a;通常1-5秒 主要操作&#xff1a; 验证对象存在性和权限检查统计信息首选项设置确定采样方法和并行度 监…...

深度解析物理机服务器故障修复时间:影响因素与优化策略

一、物理机故障修复的核心影响因素 物理机作为企业 IT 基础设施的核心载体&#xff0c;其故障修复效率直接关系到业务连续性。故障修复时间&#xff08;MTTR&#xff09;受多重因素交叉影响&#xff1a; 1. 故障类型的复杂性 硬件级故障&#xff1a; 简单故障&#xff1a;内存…...

印度全印度游戏联合会(AIGF)介绍与用途

本文为印度AIGF的介绍科普文&#xff0c;自去年开始&#xff0c;印度Rummy类游戏申请印度支付都需要拥有AIGF的会员及产品证书。 如需要rummy可以通过AIGF审核的源。码&#xff0c;或咨询AIGF的相关内容&#xff0c;可以联。系老妙。 全印度游戏联合会&#xff08;All India G…...