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 算法(1) 快速排序
快速排序(quickSort) 快排的思想:首先任意选取一个数据(通常选用数组的第一个数)作为关键数据,然后将所有比它小的数都放到它前面,所有比它大的数都放到它后面,这个过程称为一趟快速排序. 百度百 ...
- dbcp数据库连接池管理
该包主要是管理数据库的链接,获取链接.释放连接.设置最大连接数.初始化连接数.回收的空闲时间 在连接数据库时创建一个连接池可以很方便的管理所有数据库链接,和高效的使用数据库连接. 主要的两个对象是Ba ...
- vue $http请求服务
vue中的$http服务 需要引入一个叫vue-resource.js的文件,因为vue.js中没有$http服务.如果需要使用这个服务去百度下载vue-resource.js 然后引进项目即可. ...
- Spring Cloud(二):Spring Cloud Eureka Server高可用注册服务中心的配置
前言 Eureka 作为一个云端负载均衡,本身是一个基于REST的服务,在 Spring Cloud 中用于发现和注册服务. 那么当成千上万个微服务注册到Eureka Server中的时候,Eurek ...
- CUGBACM Codeforces Tranning 3 题解
链接:http://acm.hust.edu.cn/vjudge/contest/view.action? cid=62515#overview 描写叙述:第三场CF训练了.这次做的挺搞笑的,我记得这 ...
- JMeter学习笔记(三)
D. User Defined Variables:用户自定义的变量,在此我们可以定义后面原件需要引用的变量并对其进行赋值.jsessionid一般是服务器返回的,每个用户返回的都不一样,所以在此不应 ...
- V模型与测试级别
V模型与测试级别[1] 2015-06-24 目录 2.1.1 V模型2.2.1 单元测试2.2.2 集成测试2.2.3 系统测试2.2.4 验收测试 2.1.1 V模型 返回 单元测试:验证软件单元 ...
- C Pointer-to-Function 与 C++ Pointer-to-MemberFunction 的区别
在看APUE Figure1.10的时候发现signal(SIGINT, sig_int)这里的sig_int直接用的函数名,但是看Thinking-in-C++ Vol.2的时候发现mem_fun( ...
- Hadoop默认端口表及用途
端口 用途 9000 fs.defaultFS,如:hdfs://172.25.40.171:9000 9001 dfs.namenode.rpc-address,DataNode会连接这个端口 ...
- js鼠标触发事件集合
转载自:http://blog.sina.com.cn/s/blog_627002d101010yb7.html 事件 浏览器支持 解说 一般事件 onclick IE3.N2 鼠标点击时触发此事件 ...