【element+vue】点击加号增加一行,点击减号删除一行

代码实现:

页面部分: vue+element

备注:v-if =“i>0” (保证第一行不出现减号)

 <div v-for="(item,i) in studentList"><el-form-item label="学生:" prop="name"><el-input v-model="studentList[i].name" clearable placeholder="姓名"></el-input></el-form-item><el-form-item prop="age"><el-input v-model="studentList[i].age" clearable placeholder="年龄"></el-input></el-form-item><el-button circle icon="el-icon-plus" @click="addList()"></el-button><el-button circle icon="el-icon-minus" @click="subList(i)" v-if="i>0"></el-button></div>

数据部分:赋一组空值,页面自动显示第一行

 data() {return {studentList: [{name: '', age: ''}]}}

函数部分:点击加号,给数组新增一组空值,新增一行;点击减号,将行号传入,删除当前行

methods: {//加号addList() {this.studentList.push({name: '', age: ''})},//减号subList(index) {this.studentList.splice(index, 1)}}

参考文档

【element+vue】点击加号增加一行,点击减号删除一行_vue点击加号增加一组-CSDN博客

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

BUUCTF crypto做题记录(10)新手向

一、[MRCTF2020]古典密码知多少 这题一看首先能想到猪圈密码&#xff0c;每种颜色都代表一种古典密码。鉴于都是用图形表示&#xff0c;其余两种与猪圈密码类似。BUUCTF-Crypto-猪圈密码及其变种银河密码跳舞的小人_猪圈密码对照表-CSDN博客 在这篇文章中介绍一些与猪圈密码类…

深度学习 精选笔记(1)数据基本操作与线性代数

学习参考&#xff1a; 动手学深度学习2.0Deep-Learning-with-TensorFlow-bookpytorchlightning ①如有冒犯、请联系侵删。 ②已写完的笔记文章会不定时一直修订修改(删、改、增)&#xff0c;以达到集多方教程的精华于一文的目的。 ③非常推荐上面&#xff08;学习参考&#x…

Redis之一: 简介及环境安装搭建

什么是NoSQL? NoSQL&#xff0c;指的是非关系型的数据库。NoSQL有时也称作Not Only SQL的缩写&#xff0c;是对不同于传统的关系型数据库的数据库管理系统的统称。 NoSQL用于超大规模数据的存储。&#xff08;例如谷歌或Facebook每天为他们的用户收集万亿比特的数据&#xf…

Gemma谷歌(google)开源大模型微调实战(fintune gemma-2b)

Gemma-SFT Gemma-SFT(谷歌, Google), gemma-2b/gemma-7b微调(transformers)/LORA(peft)/推理 项目地址 https://github.com/yongzhuo/gemma-sft全部weights要用fp32/tf32, 使用fp16微调十几或几十的步数后大概率lossnan;(即便layer-norm是fp32也不行, LLaMA就没有这个问题, …

进行模型测量这种量出来坡面的是平面面积还是真实面积?

斜面面积&#xff0c;不是表面积。 DasViewer是由大势智慧自主研发的免费的实景三维模型浏览器,采用多细节层次模型逐步自适应加载技术,让用户在极低的电脑配置下,也能流畅的加载较大规模实景三维模型,提供方便快捷的数据浏览操作。 #DasViewer##实景三维##三维重建##三维模型…

Neo4j学习笔记2:使用Neo4j-admin import快速初始化导入数据

上一篇提到过小规模数据如何新增到数据库&#xff0c;但是一旦数据开始变多&#xff0c;效率就不够看了 同样的数据&#xff0c;使用上一篇的方法&#xff0c;预计要26天&#xff0c;但是使用Neo4j-admin import只要1分钟 参考文档在这里 文件处理 具体的导入csv文件结构可以…

微信小程序-底层框架-开发文档学习笔记

查看更多学习笔记&#xff1a;GitHub&#xff1a;LoveEmiliaForever 微信小程序开发指南 微信小程序开发文档 双线程模型 小程序是基于双线程模型的&#xff0c;在这个模型中&#xff0c;小程序的逻辑层与渲染层分开在不同的线程运行 技术选型 在对小程序的架构设计时的要求…

状态机-----

1.原理 同步的意思就是状态的跳转都是在时钟的作用下跳转的&#xff0c;有限是指状态机中状态的个数是有限的。两种状态机的共同点都是状态的跳转只和输入有关&#xff0c;区别就是如果最后的输出只和当前状态有关而与输入无关&#xff0c;则是moore型状态机。如果最后的输出不…

过滤器和监听器

文章目录 1 过滤器概念引入2 过滤器的定义和配置3 过滤器的生命周期4 过滤器链的使用5 过滤器初始化参数6 过滤器注解的应用7 案例开发之POST乱码处理8 案例开发之登录验证9 监听器概念引入10 Request域监听器11 Session域监听器12 Application域监听器13 案例开发_记录请求日志…

Vue+SpringBoot打造森林火灾预警系统

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 数据中心模块2.2 系统基础模块2.3 烟雾传感器模块2.4 温度传感器模块2.5 历史记录模块2.6 园区数据模块 三、系统设计3.1 用例设计3.1.1 森林园区基础系统用例设计3.1.2 森林预警数据用例设计 3.2 数据库设计3.2.1 烟雾…

基于“python+”潮汐、风驱动循环、风暴潮等海洋水动力模拟

原文&#xff1a;基于“python”潮汐、风驱动循环、风暴潮等海洋水动力模拟 前沿 ADCIRC是新一代海洋水动力计算模型&#xff0c;它采用了非结构三角形网格广义波动连续方程的设计&#xff0c;在提高计算精确度的同时还减小了计算时间。被广泛应用于&#xff1a;模拟潮汐和风驱…

ARM 版银河麒麟桌面系统下 Qt 开发环境搭建指南

目录 前言安装Linux ARM 版 QtCreator配置 Qt Creator配置构建套件 第一个麒麟 Qt 应用程序小结 前言 在上一篇文章信创ARM架构QT应用开发环境搭建中建议大家使用 Ubuntu X86 系统作为信创 ARM 架构 QT 应用的开发环境&#xff0c;里面使用了交叉编译的方式。这对于自己的 Qt …