<div v-for="(v,i) in list">
<el-form label-width="120px" size="small">
<el-row :span="24">
<el-col :span="11">
<el-form-item label="中心机房id *">
<el-input v-model="list[i].idc_id" placeholder="请输入机房id"></el-input>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="专线IP">
<el-input v-model="list[i].addr" placeholder="请输入专线IP">
</el-input>
</el-form-item>
</el-col>
<el-col :span="3">
<el-button type="primary" icon="el-icon-plus" size="mini" circle @click="plus(i)"></el-button>
<el-button type="warning" icon="el-icon-minus" size="mini" circle @click="minus(i)"></el-button>
</el-col>
</el-row>
</el-form>
</div>

 data中数据

    list: [{
idc_id:'',
addr: ''
}],
list1: [{
idc_id:'',
addr: ''
}],
writeidc_id:'',
writeaddr:'',
writeidc_id1:'',
writeaddr1:''
}

  加减执行方法

 plus (index) {
this.list.push({})
},
minus (index) {
this.list.splice(index,1)
},

  

vue中element-ui添加按钮的更多相关文章

  1. vue基于 element ui 的按钮点击节流

    vue的按钮点击节流 场景: 1.在实际使用中,当我们填写表单,点击按钮提交的时候,当接口没返回之前,迅速的点击几次,就会造成多次提交. 2.获取验证码,不频繁的获取. 3.弹幕不能频繁的发 基于这几 ...

  2. 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题

        方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...

  3. 解决vue中element组件样式修改无效

    vue中element组件样式修改无效 <style> .detail{ .el-input__inner { height: 48px; } } </style> 直接写st ...

  4. VUE -- 对 Element UI table中数据进行二次处理

    时间——日期 后台经常给我们返回的是 时间戳 (例如:1535620671) 这时候我们页面展现的时候需要将时间戳转换为我们要的格式 例如 (YYYY-MM-DD HH:mm:ss) 如果是在Elem ...

  5. vue.js+element ui Table+spring boot增删改查

    小白初学,不懂的还是太多了,找了好多资料才做出来的先记录一下 1.先用Spring boot创建一个包含了增删改查的项目 2.创建vue.js项目 3.安装Element UI (1)进入项目文件夹下 ...

  6. vue与element ui的el-checkbox的坑

    一,场景 通过使用checkbox,实现如图的场景, 点击某个tag,实现选中和非选中状态. 二, 官网的例子 通过切换checked值为true或者false来实现,一个checkbox的状态切换 ...

  7. 第五十三篇:Vue安装Element ui

    好家伙,之前写的一篇过时了,用不了了,更新一波 (已新建一个vue项目) 1. 在项目目录下执行:npm i element-ui -S 2. 在main.js中写入 import ElementUI ...

  8. Vue框架Element UI教程-axios请求数据

    Element UI手册:https://cloud.tencent.com/developer/doc/1270 中文文档:http://element-cn.eleme.io/#/zh-CN gi ...

  9. vue开源Element UI表单设计及代码生成器

    在日常的开发工作中,表单开发是较为繁琐且重复的.本文介绍一个我自己写的,提高开发效率的小工具. 1 可视化设计器 设计器基于Element UI ,可通过点击或拖拽的方式设计基本表单, 设计器生成的代 ...

  10. vue 使用 element ui动态添加表单

    html部分 <div class="hello"> <el-form :model="dynamicValidateForm" ref=&q ...

随机推荐

  1. spring cloud深入学习(七)-----配置中心git示例

    随着线上项目变的日益庞大,每个项目都散落着各种配置文件,如果采用分布式的开发模式,需要的配置文件随着服务增加而不断增多.某一个基础服务信息变更,都会引起一系列的更新和重启,运维苦不堪言也容易出错.配置 ...

  2. Python学习之函数(多层函数)、re模块的正则匹配--计算复杂加减乘除

    头疼,其实这个程序在我看的视频当中是当做re模块的运用来进行测试的,而到了我这里就成了简化版的了,因为我实在是做吐了,恕小弟无能,只能做简化版的.为何说是简化版呢,因为要求是给的计算式是多层嵌套的小括 ...

  3. 统一建模语言简介UML

    统一建模语言(Unified Modeling Language,UML)是用来设计软件蓝图的可视化建模语言,1997 年被国际对象管理组织(OMG)采纳为面向对象的建模语言的国际标准.它的特点是简单 ...

  4. Spring学习:程序的耦合和解耦的思路分析

    程序的耦合 耦合:程序间的依赖关系 包括: 类之间的依赖 方法间的依赖 解耦: 降低程序间的依赖关系 在实际开发中: 应该做到,编译期不依赖,运行时才依赖 解耦思路: 第一步:使用反射来创建对象,而避 ...

  5. Luogu P1712 [NOI2016]区间(线段树)

    P1712 [NOI2016]区间 题意 题目描述 在数轴上有 \(N\) 个闭区间 \([l_1,r_1],[l_2,r_2],...,[l_n,r_n]\) .现在要从中选出 \(M\) 个区间, ...

  6. PHP之文件的锁定、上传与下载的方法

    1.文件锁定 现在都在讲究什么分布式.并发等,实际上文件的操作也是并发的,在网络环境下,多个用户在同一时刻访问页面,对同一服务器上的同一文件进行着读取,如果,这个用户刚好读到一半,另一个用户就写入了消 ...

  7. NPM:如何配置maven npm私服

    https://help.sonatype.com/repomanager3/quick-start-guide-proxying-maven-and-npm#QuickStartGuide-Prox ...

  8. 基于MaxCompute打造轻盈的人人车移动端数据平台

    摘要: 2019年1月18日,由阿里巴巴MaxCompute开发者社区和阿里云栖社区联合主办的“阿里云栖开发者沙龙大数据技术专场”走近北京联合大学,本次技术沙龙上,人人车大数据平台负责人吴水永从人人车 ...

  9. [Array]167. Two Sum II - Input array is sorted

    Given an array of integers that is already sorted in ascending order, find two numbers such that the ...

  10. js图片碎片效果(移动端也适用)

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...