vue根据数组对象中某个唯一标识去重
由于在vue中,会自动在数组和对象中加入_obser__观察者模式的一些属性,所以直接用数组的filter去重(下面这种),indexOf不能准确识别
var arr = [1, 2, 2, 3, 4, 5, 5, 6, 7, 7];
var arr2 = arr.filter(function(x, index,self) {
return self.indexOf(x)===index;
});
console.log(arr2); //[1, 2, 3, 4, 5, 6 ,7]
或者用ES6的一句简单去重
var nerarr = Array.from(new Set(arr))
只能用于普通的数组去重,在vue中这个不管用,
vue中可以,写一个去重的方法
methods:{
unique(arr) { // 根据唯一标识orderId来对数组进行过滤
const res = new Map(); //定义常量 res,值为一个Map对象实例
//返回arr数组过滤后的结果,结果为一个数组 过滤条件是,如果res中没有某个键,就设置这个键的值为1
return arr.filter((arr) => !res.has(arr.OrderId) && res.set(arr.OrderId, 1))
},
}
使用
this.arr = this.unique(this.arr);
vue根据数组对象中某个唯一标识去重的更多相关文章
- JavaScript 获取数组对象中某一值封装为数组
1.获取数组对象中某一值封装为数组(一) data = [["2000-06-05",116],["2000-06-06",129]]; var dateLis ...
- js 向数组对象中添加属性和属性值
let resultList = [{"name":"a1"},{"name":"b1"}] resultList.fo ...
- problem: vue之数组元素中的数组类型值数据改变却无法在子组件视图更新问题
问题:给父组件上的一个数组中的某个元素中的数组类型值,添加值后,数据没有在子组件上更新. 对元素添加值之后,vue的数据其实已经更新了并传给了子组件,子组件中没有立即更新. 那么这里有个问题,在子组件 ...
- js中的数组对象中的方法解析
concat()方法: 合并两个数组,返回新对象的结果: join()方法 : 把数组内的所有元素加入到一个字符串中,传入的分隔符就是指定的分隔符 pop()方法: 删除数组并返回数组的最后一个元 ...
- js篇-判断数组对象中是否含有某个值,并返回该条数据
项目背景需求是: 已知: var a=[{name:'jenny',age:18},{name:'john',age:19},{name:'jack',age:20}] var b ='jenny' ...
- js根据数组对象中某个元素合并数组
一个数组,根据数组中某个元素,合并数组 // 需要被合并的数组,把Index相同的数组合并 const arr = [{id:0,name:'张三'}, {id:0,name:'李四'}, {id:1 ...
- js 去掉数组对象中的重复对象
export function deteleObject(obj) { var uniques = []; var stringify = {}; for (var i = 0; i < obj ...
- 从一个数组对象中取key 和value组成一个新的对象
const type = [ {key:'TimeWeiDu',value:'时间维度'}, {key:'TranType',value:'交易类型'}, {key:'OrderType',value ...
- javascrpit sort()数组对象中排序
/*ionic 调用 * @param attr 排序的属性 如number属性 * @param rev true表示升序排列,false降序排序 * */ commonSortMethod(att ...
随机推荐
- Python 爬虫实例(5)—— 爬取爱奇艺视频电视剧的链接(2017-06-30 10:37)
1. 我们找到 爱奇艺电视剧的链接地址 http://list.iqiyi.com/www/2/-------------11-1-1-iqiyi--.html 我们点击翻页发现爱奇艺的链接是这样的 ...
- JVM虚拟机(四):JVM 垃圾回收机制概念及其算法
垃圾回收概念和其算法 谈到垃圾回收(Garbage Collection)GC,需要先澄清什么是垃圾,类比日常生活中的垃圾,我们会把他们丢入垃圾箱,然后倒掉.GC中的垃圾,特指存于内存中.不会再被使用 ...
- Go语言核心之美 4.3-多返回值
在Go语言中.函数能够有多个返回值,这个特性我们已经在之前的样例见过非常多,非常多标准库函数都会返回两个值,一个是期望得到的函数执行结果,另外一个是函数出错时的错误值. 以下的程序是findlinks ...
- github提交一个空目录
github默认不上传空目录,有的时候需要空目录来保持程序的结构. 二个小问题. 1.始终保持空目录,即时里面有文件,也全部忽略掉. 建立一个.gitignore文件放到空目录内. mkdir emp ...
- atitit.科技公司的超级武器--超级框架,到底要不要自己的框架??
atitit.科技公司的超级武器--超级框架,到底要不要自己的框架?? 我们生活的时代,,任何一个时代,总有人会以经济之类的理由劝阻人向未知领域探索,基本上,他们的理由无非几种: 1.把钱投到更需要的 ...
- Spring学习12-Spring利用mock进行单元测试
一.概述 对于Java组件开发者来说,他们都盼望拥有一组能够对组件开发提供全面测试功能的好用的单元测试.一直以来,与测试独立的Java对象相比,测试传统型J2EE Web组件是一项更为困难的任务 ...
- 每日英语:The Upside of Favoritism
As the head of the entertainment division of a major public-relations firm in New York, Janelle was ...
- Nginx设置expires设定页面缓存时间 不缓存或一直使用缓存
配置expires expires起到控制页面缓存的作用,合理的配置expires可以减少很多服务器的请求 要配置expires,可以在http段中或者server段中或者location段中加入 l ...
- Okra框架(三) 搭建HTTP服务器
Okra通过封装成熟高效的框架以简化应用程序服务器构建的过程.上一篇介绍了使用Okra快速搭建Socket服务器. 本篇承接上一篇,介绍快速搭建简单高性能的Http服务器. 这里需要说明一下Okra框 ...
- 基于Ambari构建自己的大数据平台产品
目前市场上常见的企业级大数据平台型的产品主流的有两个,一个是Cloudera公司推出的CDH,一个是Hortonworks公司推出的一套HDP,其中HDP是以开源的Ambari作为一个管理监控工具,C ...