需求描述:

  点击删除时,仅删除当前选中的这个对象。

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-动态修改数组的更多相关文章

  1. Vue 动态修改data 值 并触发视图更新

    Vue 动态修改data 值 并触发视图更新 this.$set(obj, key, '') // Vue 动态修改或者添加data key 并触发视图更新

  2. Vue动态修改网页标题

    业务需求,进入页面的时候,网页有个默认标题,加载的网页内容不同时,标题需要变更. 例:功能授权,功能授权(张三). Vue下有很多的方式去修改网页标题,这里总结下解决此问题的几种方案: 一.最笨方案 ...

  3. vue中修改数组,dom未更新的问题

    vue中我们会频繁操作各种数据,但有时候发现修改完数据以后,dom并未更新? 比如有一个数组对象: obj = [{'name': 'joy'},{'name': 'bowen'}] 我要循坏插入某个 ...

  4. vue动态修改title

    1.项目中,cmd下 ,运行:cnpm install vue-wechat-title --save 2.在 main.js 中,设置: import VueWechatTitle from 'vu ...

  5. vue $set修改数组

    看了别人写的,自己简单写一下自己的理解. 因为 JavaScript 的限制,Vue.js 不能检测到下面数组变化,所以,想要正常是不能通过操作数组来渲染dom的,解决的方法是通过set方法, 在组件 ...

  6. Vue动态修改class

    #####对象方法-最简单的绑定(这里的active加不加单引号都可以,以下也一样都能渲染) :class="{ 'active': isActive }"1判断是否绑定一个act ...

  7. vue 动态修改 css

    <div v-for="i in resultDate" v-if="i.ProjectId>='4'" @click=EveyTesttInfo( ...

  8. vue 动态修改el-upload 的action

    action是一个必填参数,且其类型为string,我们把action写成:action,然后后面跟着一个方法名,调用方法,返回你想要的地址,代码示例: //html 代码 <el-upload ...

  9. 微信小程序setdata修改数组或对象

    1.this.setdata修改数组的固定一项的值 changeItemInArr: function() { this.setData({ 'arr[0].text':'changed data' ...

  10. 基于Vue的SPA动态修改页面title的方法

    最近基于VUE做个SPA手机端web发现动态修改页面标题通过document.title=xxxx 来修改着实蛋疼,而且在IOS的微信端据说没效果.百度发现要针对IOS的微信做点额外的操作,即:创建一 ...

随机推荐

  1. Redis_集群_主从模式_哨兵模式

    1.主从模式 2.哨兵模式

  2. canvas意料之外获得降龙十八掌的效果

    瞎整本来是要点击编辑多张图片的,没想到弄成这样.这不是电视剧里的降龙十八掌吗 特此记录留着以后用,看来canvas做游戏特效都不错啊. <!DOCTYPE html><html la ...

  3. THE DEFINITIVE GUIDE TO DEBUGGING JAVASCRIPT

    FIGURING OUT WHERE THE ERROR COULD BE READ THE CODE USING THE CONSOLE THE CHROME DEV TOOLS THE DEBUG ...

  4. Nginx 学习笔记(八)http和https跨域问题解决

    今天在做网易云信的时候,修改了一下源码,使用自己的服务端进行登陆, 注意:这里是使用http域名访问https域名 1.下载源码,配置了IM的域名,im.tinywan.com 没有开启https,具 ...

  5. Linux系统中用户组、文件权限浅解

    用户组 在linux中的每个用户必须属于一个组,不能独立于组外.在Linux中每个文件有所有者.所在组.其它组的概念. [所有者] 一般为文件的创建者,谁创建了该文件,就天然的成为该文件的所有者,用& ...

  6. 在线xss练习平台

    在线xss练习平台 HTTPS://ALF.NU/ALERT1 这个是只要能输出alert1就算赢. No.1第一个就很简单了,什么都没有过滤,只需要闭合前面的标签就可以执行xss了. 1 " ...

  7. Docker 网络设置

    一.Docker 网络默认使用的 Bridge 模式 默认生成为 docker0 :每个容器使用 veth 对,一头在容器的网络 namespace 中,一头在 docker0 上: 1.Docker ...

  8. webpack提示安装webpack-cli

    webpack 安装后提示CLI webpack 4X 后需要安装webpack-cli 请注意需要安装在同一目录 方法: 第一步:npm install -g webpack-cli 第二部: 同步 ...

  9. Chrome实用技巧集锦

    1. 截取整个网页内容: 步骤:(F12 或 Ctrl Shift I 进入开发者模式)  ——>  Ctrl Shift P 弹出输入框  ——>  输入框中输入:Captrue ful ...

  10. actionsheet(操作表)

    推荐使用锚点方式显示.隐藏actionsheet: 若要使用js代码动态显示.隐藏actionsheet,同样在popover插件的构造方法中传入"toggle"参数即可 //传入 ...