ElementUI动态添加表单项
昨天感冒发烧了,脑子不好使。在实现这个动态表单项时一直报错脑瓜子嗡嗡的!
不过好在昨天休息好了,今天起来趁脑瓜子好使,一会就弄好了。
这里记录一下
<el-form-itemv-for="(classId,index) in addFom.classIds":label="`班级${index+1}`"><el-row :gutter="12"><el-col :span="12"><el-input v-model="classId.classId"></el-input></el-col><el-col :span="5"><el-button type="danger" icon="el-icon-delete" circle @click="removeClassId(index)"/></el-col></el-row></el-form-item><el-form-item><el-button type="success">提交</el-button><el-button @click="addClassId" :disabled="disabled">添加班级</el-button></el-form-item>
data(){return{addFom: {teaName: '',teaSex: true,teaType: true,teaPhone: '',seniority: 0,classIds: [{ classId: '' }]}}}/* 动态添加表单行 */addClassId() {this.addFom.classIds.length < 6 ? this.addFom.classIds.push({ classId: '' }) : this.disabled = true},/* 动态删除表单行 */removeClassId(index) {this.addFom.classIds.splice(index, 1)this.disabled = false}
总结
其实就是利用了vue的v-for循环渲染。通过添加数组实现动态添加表单项
相关文章:
ElementUI动态添加表单项
昨天感冒发烧了,脑子不好使。在实现这个动态表单项时一直报错脑瓜子嗡嗡的! 不过好在昨天休息好了,今天起来趁脑瓜子好使,一会就弄好了。 这里记录一下 <el-form-itemv-for"(classId,index) in addFom.classIds":lab…...
Myatis和MybatisPlus常见分页方式
Myatis和MybatisPlus常见分页方式 一、mybaits 原生limit分页 SELECT * FROM order_info limit #{pageNow},#{pageSize}分页插件(ssm中,通过xml配置分页。springboot通过则通过配置文件) PageHelper插件:PageHelper.startPage(…...
利用ChatGPT绘制思维导图——以新能源汽车竞品分析报告为例
随着人们对环境保护的日益关注和传统燃油汽车的限制,全球范围内对新能源汽车的需求不断增长。新能源汽车市场的激烈竞争使得了解各个竞品的特点和优劣成为关键。然而,针对这一领域的详尽竞品分析却常常需要大量时间和精力。 在此背景下,人工智…...
redis集群搭建(非常详细,适合新手)
免密登录脚本 #!/bin/bash # 检查是否已经存在 SSH 密钥对,如果没有则创建一个 if [ ! -f ~/.ssh/id_rsa ]; thenssh-keygen -t rsa -b 4096 -f ~/.ssh/id_rsa -N fi# 为每个目标主机复制公钥 for ip in 192.168.9.{11..16}; dossh-copy-id -i ~/.ssh/id_rsa.pub …...
CTFshow web93-104关
这周要学习的是php代码审计 根据师兄的作业 来做web入门的93-104关 93关 看代码 进行分析 他的主函数 include("flag.php"); highlight_file(__FILE__); if(isset($_GET[num])){ $num $_GET[num]; if($num4476){ die("no no no!"); …...
ElasticSearch详细操作
ElasticSearch搜索引擎详细操作以及概念 文章目录 ElasticSearch搜索引擎详细操作以及概念 1、_cat节点操作1.1、GET/_cat/nodes:查看所有节点1.2、GET/_cat/health:查看es健康状况1.3_、_GET/_cat/master:查看主节点1.4、GET/_cat/indices&a…...
【OpenVINOSharp】 基于C#和OpenVINO2023.0部署Yolov8全系列模型
基于C#和OpenVINO2023.0部署Yolov8全系列模型 1 项目简介1.1 OpenVINOTM 2 OpenVinoSharp2.1 OpenVINOTM 2023.0安装配置2.2 C 动态链接库2.3 C#构建Core推理类2.4 NuGet安装OpenVinoSharp 3 获取和转换Yolov8模型3.1 安装ultralytics3.2 导出yolov8模型3.3 安装OpenVINOTM Pyt…...
121. 买卖股票的最佳时机
题目描述 给定一个数组 prices ,它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格。 你只能选择 某一天 买入这只股票,并选择在 未来的某一个不同的日子 卖出该股票。设计一个算法来计算你所能获取的最大利润。 返回你可以从这笔交易中获取的…...
FDO(Feedback-Driven Optimization) LTO(Link-Time Optimization)
反馈驱动优化(Feedback-Driven Optimization,FDO)和链接时优化(Link-Time Optimization,LTO)是两种重要的编译器优化技术。下面我们详细介绍这两种技术: 反馈驱动优化 (FDO): FDO 是…...
低成本无刷高速吹风机单片机方案
高速吹风机的转速一般是普通吹风机的5倍左右。一般来说,吹风机的电机转速一般为2-3万转/分钟,而高速吹风机的电机转速一般为10万转/分钟左右。高转速增加了高风速。一般来说,吹风机的风力只有12-17米/秒,而高速吹风机的风力可以达…...
使用Python爬取某查查APP端(Appium自动化篇)
1. 写在前面 某查查网站反爬虫风控还是较强的,之后会分别介绍一下PC端协议、APP端自动化、APP端接口协议三种采集方案。这里主要介绍APP端的自动化方式,APP端自动化方式需要登陆账号,协议的话需要签名授权(自动化经测试没有太多限…...
vue3实现组件可拖拽 vuedraggable
npm i -S vuedraggablenext 中文文档,里面有完整代码案例,值得一看 vue.draggable vue3 版本在工作台中的应用场景 - itxst.com...
gradio常用组件
gradio常用组件 1.gradio程序启动2.写入html相关代码3.文本框4. 回车触发事件5.选择按钮框6.下拉框7.点击按钮8.清空按钮9.监听组件10.输出流11.template 1.gradio程序启动 import gradio as gr def tab():pass with gr.Blocks() as ui:gr.Markdown("# <center>&am…...
vcode开发go
配置环境变量 go env -w GO111MODULEon go env -w GOPROXYhttps://goproxy.cn,direct 创建文件夹 mkdir hello cd hello go mod help go mod help 初始化一个项目 go mod init hello 获取第三方包 go get github.com/shopspring/decimal 将依赖包下载到本地 go mod …...
聊城大学823软件工程考研
1.什么是软件工程?它目标和内容是什么? 软件工程就是用科学的知识和技术原理来定义,开发,维护软件的一门学科。 软件工程目标:付出较低开发成本;达到要求的功能;取得较好的性能;开发的软件易于移植&…...
Spring Initailizr--快速入门--SpringBoot的选择
😀前言 本篇博文是关于IDEA使用Spring Initializer快速创建Spring Boot项目的说明,希望能够帮助到您😊 🏠个人主页:晨犀主页 🧑个人简介:大家好,我是晨犀,希望我的文章可…...
大数据课程I1——Kafka的概述
文章作者邮箱:yugongshiye@sina.cn 地址:广东惠州 ▲ 本章节目的 ⚪ 了解Kafka的概念; ⚪ 掌握Kafka的配置与启动; 一、简介 1. 基本概念 Apache kafka 是一个分布式数据流平台。可以从如下几个层面来理解: 1. 我们可以向Kafka发布数据以及从Kafka订阅…...
视图簇 se54 sm34 se54
今天演练了一下 维护视图到视图簇的过程。 se11建表,建表之后 【使用程序】→【表维护生成器】 se54 新建视图簇 对象结构 选中其中一行 字段附属 PS:以上每一行都要设置过去 , 设置完成了 激活 sm34展示...
风丘科技将亮相 EVM ASIA 2023
风丘科技将首次亮相 EVM ASIA 2023 WINDHILL will debut EVM ASIA 2023 ——可持续移动的未来 —The Future of SUSTAINABLE Mobility EVM ASIA 2023是亚太地区电气化的国际性展会,专注于新能源汽车、充电技术及汽车零件制造等。展会致力于促进包括充电站、交通…...
腾讯云服务器S6、SA3、S5、SA2等CVM实例介绍
腾讯云服务器CVM实例标准型S6、SA3、S5、SA2等多款实例降价,最高幅度达40%,标准型S6云服务器是新一代云服务器,SA3和SA2是AMD处理器,标准型S5是次新一代的云服务器,如下图: 腾讯云服务器CVM降价 标准型S6&a…...
浅谈 React Hooks
React Hooks 是 React 16.8 引入的一组 API,用于在函数组件中使用 state 和其他 React 特性(例如生命周期方法、context 等)。Hooks 通过简洁的函数接口,解决了状态与 UI 的高度解耦,通过函数式编程范式实现更灵活 Rea…...
[特殊字符] 智能合约中的数据是如何在区块链中保持一致的?
🧠 智能合约中的数据是如何在区块链中保持一致的? 为什么所有区块链节点都能得出相同结果?合约调用这么复杂,状态真能保持一致吗?本篇带你从底层视角理解“状态一致性”的真相。 一、智能合约的数据存储在哪里…...
基于当前项目通过npm包形式暴露公共组件
1.package.sjon文件配置 其中xh-flowable就是暴露出去的npm包名 2.创建tpyes文件夹,并新增内容 3.创建package文件夹...
微信小程序 - 手机震动
一、界面 <button type"primary" bindtap"shortVibrate">短震动</button> <button type"primary" bindtap"longVibrate">长震动</button> 二、js逻辑代码 注:文档 https://developers.weixin.qq…...
页面渲染流程与性能优化
页面渲染流程与性能优化详解(完整版) 一、现代浏览器渲染流程(详细说明) 1. 构建DOM树 浏览器接收到HTML文档后,会逐步解析并构建DOM(Document Object Model)树。具体过程如下: (…...
数据链路层的主要功能是什么
数据链路层(OSI模型第2层)的核心功能是在相邻网络节点(如交换机、主机)间提供可靠的数据帧传输服务,主要职责包括: 🔑 核心功能详解: 帧封装与解封装 封装: 将网络层下发…...
IoT/HCIP实验-3/LiteOS操作系统内核实验(任务、内存、信号量、CMSIS..)
文章目录 概述HelloWorld 工程C/C配置编译器主配置Makefile脚本烧录器主配置运行结果程序调用栈 任务管理实验实验结果osal 系统适配层osal_task_create 其他实验实验源码内存管理实验互斥锁实验信号量实验 CMISIS接口实验还是得JlINKCMSIS 简介LiteOS->CMSIS任务间消息交互…...
Caliper 配置文件解析:config.yaml
Caliper 是一个区块链性能基准测试工具,用于评估不同区块链平台的性能。下面我将详细解释你提供的 fisco-bcos.json 文件结构,并说明它与 config.yaml 文件的关系。 fisco-bcos.json 文件解析 这个文件是针对 FISCO-BCOS 区块链网络的 Caliper 配置文件,主要包含以下几个部…...
JavaScript 数据类型详解
JavaScript 数据类型详解 JavaScript 数据类型分为 原始类型(Primitive) 和 对象类型(Object) 两大类,共 8 种(ES11): 一、原始类型(7种) 1. undefined 定…...
解决:Android studio 编译后报错\app\src\main\cpp\CMakeLists.txt‘ to exist
现象: android studio报错: [CXX1409] D:\GitLab\xxxxx\app.cxx\Debug\3f3w4y1i\arm64-v8a\android_gradle_build.json : expected buildFiles file ‘D:\GitLab\xxxxx\app\src\main\cpp\CMakeLists.txt’ to exist 解决: 不要动CMakeLists.…...
