vue里面怎么删除部分页面_vue中数组删除,页面没重新渲染

创建一个组件时,数据类型是数组,在删除这个数组中的数据时,数组中的数据是对的,但页面渲染的数据却不对。

举例:(不一定复现)

  • {{item.name}}

    删除

export default {

data() {

return {

peoples: [

{

name: 'tom',

id: '1'

},

{

name: 'kitty',

id: '2'

},

{

name: 'jack',

id: '3'

}

]

}

},

methods: {

del (index) {

this.peoples.splice(index, 1)

}

}

}

原因:设置v-for时:key用的是index。key的值不是唯一造成的。

解决::key="item.id"设置成唯一的值

原理:待补

修改vue中的挂载页面(index.html)的路径

修改vue中的挂载页面(index.html)的路径 2019年03月30日 12:07:12 VegasLemon 阅读数 501    版权声明:本文为博主原创文章,未经博主允许不得转载. htt ...

简述在Js或Vue中监听页面的刷新、关闭操作

1.背景 大家是否经常遇到在关闭网页的时候,会看到一个确定是否离开当前页面的提示框?想一些在线测试系统.信息录入系统等就经常会有这一些提示,避免用户有意或者无意中关掉了页面,导致数据丢失.而最近在做项 ...

JSON相关知识,转载:删除JSON中数组删除操作

一:JSON是什么 JSONg格式:对象是一个无序的“名称/值”对的集合. 对象以括号开始,括号结束. 名称冒号分隔值. "名称/值"之间用逗号分隔 例: var people = ...

当Vue中img的src是动态渲染时不显示问题

最近遇见动态渲染img时,想起了当初刚开始写vue时,曾经遇见的一个小小坑. Vue中:img的src属性是动态渲染时不显示问题1.需求:展示用户头像,数据从后台获取,如果没有拿到则显示默认图片. 如 ...

vue中如何刷新页面

vue中刷新页面的方法 1. 不能使用 this.$router.go(0) 或者 window.reload() 不起作用还特别恶心 这个才是有效果的刷新页面,只要照图敲,就能有效果 我们在 app ...

Vue中数组元素被替换,页面没有动态展示

原始代码 页面没有相应goodsList替换,打印goodsList数据已经被替换: (借用https://www.cnblogs.com/belongs-to-qinghua/p/11112613. ...

vue中监听页面滚动和监听某元素滚动

①监听页面滚动 在生命周期mounted中进行监听滚动: mounted () { window.addEventListener('scroll', this.scrollToTop) }, 在方法 ...

js中数组删除 splice和delete的区别,以及delete的使用

var test=[];test[1]={name:'1',age:1};test[2]={name:'2',age:2};test[4]={name:'3',age:3}; console.log( ...

随机推荐

zabbix_server的自动发现,实现批量添加主机,并链接到模板

一.需求 zabbix 服务器可以手动加入zabbix-agent客户端,对于少量的机器,这没有什么.但到了线上,我们有大量的服务器需要监控时,如果再一个个的手动加的话,工作量势必会增加很多.这时,z ...

JavaScript学习心得(三)

一 变量 var:变量声明 变量名 =:赋值 简单值类型 全局变量:编程的一般规则——应用程序应该只完成必须的最少功能,如果一个变量不是绝对必需,就不该是全局:全局变量对维护性能不利,因为需要一直维护 ...

使用netty构建一个socks proxy

使用netty构建一个socks proxy   最近在做的项目,需要自己搭建一个socks代理.netty4.0附带了一个socks代理的样例,但是3.x就没有这个东西了,碰巧使用的又是3.7,就只 ...

tsunami:一种基于UDP协议的高速传输

一. 需求 近期在做数据库迁移.常常须要打包实例传输.传统scp感觉非常慢. 二. 软件信息 1. 软件主页:http://tsunami-udp.sf.net/ 2. 软件安装:直接源代码make ...

产品CEO?别傻了,你不是拿破仑

编者按:本文出自技术产品经理Daniel Elizalde的博客,中文版由天地会珠海分舵进行编译. 全文针对如今流行的把产品经理比喻成"产品CEO"的这一说法进行深入的分析.跟大家 ...

JAVA常用API(Date、DateFormat、Calendar、System、Math、基本数据类型包装类)

注:本文所有内容均属个人见解,如有错误望各位大佬好心指点批评,不胜感激 本章重点单词: parse:解析 format:格式化 pattern:模式 amount:数量 filed :领域 1.Dat ...

一个MySQL视图的优化过程

1.需要优化的sql 最近做一个基于.net mvc和MySQL的仓储系统的优化工作,遇到了一个执行特别慢的SQL语句,经过一番折腾,终于搞定啦,分享一下过程.问题就是下面这个家伙: create o ...

.NET MVC+angular导入导出

cshtml:

【PHP篇】变量与常量

变量: 变量的作用域为函数区域 判断是否存在:isset($变量名)://返回bool 判断是否为空:empty($变量名)//变量未声明或者值为空返回1,否则返回false 清除变量:unset($ ...

android:ems="10"是什么意思

android:ems = " 设置TextView或者Edittext的宽度为10个字符的宽度.当设置该属性后,控件显示的长度就为10个字符的长度,超出的部分将不显示. xml中 andr ...

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值