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的微信做点额外的操作,即:创建一 ...
随机推荐
- js中html拼接
https://i.cnblogs.com/EditPosts.aspx?postid=10620765&update=1
- POJ - 2096 Collecting Bugs(概率dp)
https://vjudge.net/problem/POJ-2096 题意 一个软件有s个子系统,会产生n种bug.某人一天发现一个bug,这个bug属于某种bug,发生在某个子系统中.求找到所有的 ...
- hdu 6441 (费马大定理+勾股数 数学)
题意是给定 n 和 a,问是否存在正整数 b,c 满足:a^n + b^n == c^n.输出 b c,若不存在满足条件的 b,c,输出 -1 -1. 当 n > 2 时,由费马大定理,不存在 ...
- IO流----操作文件的9种方法代码实现
IO流----操作文件的9种方法代码实现: 1:使用字节流读写数据: 四种方式: method1: 每次读写一个字节,边读边写: /* * 复制文本文件. * * 数据源:从哪里来 ...
- javascript&&jquery编写插件模板
javascrpt插件编写模板 这里不分享如何编写插件,只留一个框架模板,使用面向对象的形式进行编写,方便管理 ;(function(window,document){ function FnName ...
- Silverlight 样式的灵活使用
众所周知,Silverlight将界面设计与代码实现分开.即便如此,如果不能灵活地运用样式Style,开发的效率依然会比较低.比如,针对类似的TextBlock,你可能需要反复地在设计器xaml中复制 ...
- 利用ssh操控远程服务器
这里的”远程”操控的方法实际上也不是真正的远程.,這此操作方法主要是在一个局域网内远程操控电脑 (在一个路由器下).可以把它做成在互联网中的远程操控, 不过技术难度上加了一个等级, 如果你想是想人在公 ...
- APPLE-SA-2019-3-25-3 tvOS 12.2
APPLE-SA-2019-3-25-3 tvOS 12.2 tvOS 12.2 is now available and addresses the following: CFStringAvail ...
- bean的装配方式(注入方式,构造注入,setter属性注入)
bean的装配方式有两种,构造注入和setter属性注入. public class User { private String username; private String password; ...
- mysql每组前N条
SELECT * from ( select end rownum, else @prov:=t.province end prov, t.* from ( money UNION all money ...