Vue-动态修改数组
需求描述:
点击删除时,仅删除当前选中的这个对象。

html:
<el-card shadow="never" style="position: relative;">
<div class="lottery-ct">
总量:
<el-input type="number" @change="totalChange(item)" v-model="item.totalNum" style="width: 12%;" :disabled="isOpen"></el-input>
库存: {{item.stockNum}}
</div>
<img style="position: absolute;right: 0;top: 10px;right: 10px;cursor: pointer;" src="data:images/i-cl-close1.115e49e.png" @click="closeList(item)"></img>
</el-card>
@click="closeList(item)" 将当前循环的 item 传入 js:
closeList(item){
this.list.splice(this.list.indexOf(item), 1)
},
运用 splice (要删除的元素, 删除个数)
Vue-动态修改数组的更多相关文章
- Vue 动态修改data 值 并触发视图更新
Vue 动态修改data 值 并触发视图更新 this.$set(obj, key, '') // Vue 动态修改或者添加data key 并触发视图更新
- Vue动态修改网页标题
业务需求,进入页面的时候,网页有个默认标题,加载的网页内容不同时,标题需要变更. 例:功能授权,功能授权(张三). Vue下有很多的方式去修改网页标题,这里总结下解决此问题的几种方案: 一.最笨方案 ...
- vue中修改数组,dom未更新的问题
vue中我们会频繁操作各种数据,但有时候发现修改完数据以后,dom并未更新? 比如有一个数组对象: obj = [{'name': 'joy'},{'name': 'bowen'}] 我要循坏插入某个 ...
- vue动态修改title
1.项目中,cmd下 ,运行:cnpm install vue-wechat-title --save 2.在 main.js 中,设置: import VueWechatTitle from 'vu ...
- vue $set修改数组
看了别人写的,自己简单写一下自己的理解. 因为 JavaScript 的限制,Vue.js 不能检测到下面数组变化,所以,想要正常是不能通过操作数组来渲染dom的,解决的方法是通过set方法, 在组件 ...
- Vue动态修改class
#####对象方法-最简单的绑定(这里的active加不加单引号都可以,以下也一样都能渲染) :class="{ 'active': isActive }"1判断是否绑定一个act ...
- vue 动态修改 css
<div v-for="i in resultDate" v-if="i.ProjectId>='4'" @click=EveyTesttInfo( ...
- vue 动态修改el-upload 的action
action是一个必填参数,且其类型为string,我们把action写成:action,然后后面跟着一个方法名,调用方法,返回你想要的地址,代码示例: //html 代码 <el-upload ...
- 微信小程序setdata修改数组或对象
1.this.setdata修改数组的固定一项的值 changeItemInArr: function() { this.setData({ 'arr[0].text':'changed data' ...
- 基于Vue的SPA动态修改页面title的方法
最近基于VUE做个SPA手机端web发现动态修改页面标题通过document.title=xxxx 来修改着实蛋疼,而且在IOS的微信端据说没效果.百度发现要针对IOS的微信做点额外的操作,即:创建一 ...
随机推荐
- STM32学习笔记:【001】时钟树与RCC
导言 如果学过单片机的同学应该不会陌生,学习51单片机时最经常听到的就是“最小系统”. 最小系统里面少不了晶振,否则单片机无法工作. 单片机需要晶振(时钟源)来工作,那么对于STM32芯片同样如此. ...
- HDU 1046(最短路径 **)
题意是要在一个矩形点阵中求能从一点出发遍历所有点再回到起始点的最短路径长度. 不需要用到搜索什么的,可以走一个“梳子型”即可完成最短路径,而情况可以被分成如下两种: 一.矩形的长或宽中有偶数,则可以走 ...
- 【由浅入深理解java集合】(一)——集合框架 Collction、Map
本篇文章主要对java集合的框架进行介绍,使大家对java集合的整体框架有个了解.具体介绍了Collection接口,Map接口以及Collection接口的三个子接口Set,List,Queue. ...
- SQL的六种约束
https://blog.csdn.net/z120270662/article/details/79501621
- mini2440串口使用
1.安装驱动CH340-USB转串口驱动,安装完成最好重启一下电脑. 2.用串口线将开发板与pc项链,并打开电源,通过电脑设备管理器查看端口(下一步要用到). 3.运行SecureCRT.exe,并建 ...
- 【Django】git建仓上传时遇到的小问题
根据教程 http://tutorial.djangogirls.org/zh/deploy/,在github上建仓上传项目文件. 执行到 git push -u origin master 时,输入 ...
- Sqlserver 连接oracle和mysql数据库 已经oracle导入sqlserver表数据
SQL Server2012创建连接服务器到ORACLE11G 8,百思考不知道原因啊??突然我发现如下:链接服务器—〉访问接口—〉OraOLEDB.Oracle—〉允许进程内没有勾上,但是我想上面的 ...
- Python 爬虫一 简介
什么是爬虫? 爬虫可以做什么? 爬虫的本质 爬虫的基本流程 什么是request&response 爬取到数据该怎么办 什么是爬虫? 网络爬虫(又被称为网页蜘蛛,网络机器人,在FOAF社区中间 ...
- EL表达式 EL函数 自定义el函数 《黑马程序员_超全面的JavaWeb视频教程vedio》
\JavaWeb视频教程_day12_自定义标签JSTL标签库,java web之设计模式\day12_avi\12.EL入门.avi; EL表达式 1. EL是JSP内置的表达式语言! * jsp2 ...
- 2016521-Java-第八周学习总结
课本知识点 start() run()定义线程线程对象被调度之后所执行的操作 -sleep(int millsecond),必须在try-catch语句块中调用sleep方法 sAlive() 线程同 ...