vue中对象数组去重
其实很简单,一般的数组去重可以直接用 new Set() 方法即可,但是数组对象的话,比较复杂,不能直接用,我们可以采取间接的方法来去重
unique(arr) {
const res = new Map();
return arr.filter((arr) => !res.has(arr.id) && res.set(arr.id, 1))
}
下面有一个示例,根据对象的id作为去重的依据:
<el-button type="primary" size="medium" @click="quChong()">点击</el-button>
quChong() {
let arr = [
{
id: 1,
name: '111'
},
{
id: 1,
name: '111'
},
{
id: 2,
name: '222'
},
{
id: 3,
name: '333'
}
];
console.log(arr);
console.log('--------------------');
let arr1 = this.unique(arr);
console.log(arr1);
},
unique(arr) {
const res = new Map();
return arr.filter((arr) => !res.has(arr.id) && res.set(arr.id, 1));
},

这样就很简单的去重了
嗯,就酱~~
vue中对象数组去重的更多相关文章
- JavaScript中对象数组去重方法
在一次对后端返回的对象数组的操作时想通过indexOf()或者includes()的方法来实现对对象数组的去重但是行不通,因为用indexOf()返回的都是-1,一下记录两种对象数组(更具指定属性)去 ...
- JavaScript中好用的对象数组去重
对象数组去重 Demo数据如下: var items= [{ "specItems": [{ "id": "966480614728069122&qu ...
- ES6 set和map数据结构对对象数组去重简单实现
自从有了es6的set数据结构,数组的去重可以简单用一行代码实现,比如下面的方式 let arr = [1, 2, 2, 3, 4] function unique (arr) { return [. ...
- vue中修改数组,dom未更新的问题
vue中我们会频繁操作各种数据,但有时候发现修改完数据以后,dom并未更新? 比如有一个数组对象: obj = [{'name': 'joy'},{'name': 'bowen'}] 我要循坏插入某个 ...
- 对List中对象的去重
今天项目中遇到了一个对List中对象去重的问题. 首先对于我们自己系统中的对象我们只要重写该对象的 equal 和 hashcode 即可(利用对象中的能够唯一确定对象的属性). 但是我遇到的不是本系 ...
- Javascript中的数组去重-indexof方法
在Javascript中,有时我们会用到数组去重.我在这里给大家介绍一下本人认为最简单实用的一种方法-indexOf()去重. var arr = [1,1,1,2,2,2,3,3,4,5,6,2,1 ...
- JavaScript中对象数组 作业
var BaiduUsers = [], WechatUsers = []; var User = function(id, name, phone, gender, age, salary) { t ...
- JavaScript中对象数组 根据某个属性值 然后push到新的数组
原文链接 https://segmentfault.com/q/1010000010075035 将下列对象数组中,工资大于1w的员工,增加到对象数组 WanSalary中 var BaiduUser ...
- JavaScript中对象数组 作业题目以及作业
var BaiduUsers = [], WechatUsers = []; var User = function(id, name, phone, gender, age, salary) { t ...
随机推荐
- vmtools的功能
1.vmtoools是vmware公司的组件 2.vmtools主要安装在Guest OS中 3.在workstation版本中可以是选件安装,但在vsphere中却是必选安装 4.vmtools可以 ...
- three.js 居中-模型
api: 代码: <!DOCTYPE html> <html lang="en"> <head> <title>three.js w ...
- ABP JS调用接口 获取返回的数据
var _userService = abp.services.app.user; console.log(abp.services.app.user); _userService.getUserBy ...
- Python中的next()\iter()函数详解
什么是可迭代的对象(Iterable,即可以用for循环的对象)和迭代器(Iterator) Iterable: 一类是:list.tuple.dict.set.str 二类是:generator(都 ...
- ZROI 暑期高端峰会 A班 Day1 组合计数
AGC036F Square Constriants 一定有 \(l_i<p_i\le r_i\). 考虑朴素容斥,枚举每个数是 \(\le l_i\) 还是 \(\le r_i\).对于 \( ...
- C++2.0新特性(三)——<=default,=delete、alias(别名)、noexcept、override、final、以及和const对比>
一.=default,=delete 1.首先我们要回顾一下类默认函数的概念: C++中,当我们设计与编写一个类时,若不显著申明,则类会默认为我们提供如下几个函数: (1)构造函数(A()).(2)析 ...
- Unittest 类方法
import unittest,time from selenium import webdriver class TestClass(unittest.TestCase): @classmethod ...
- 如何保证redis数据都是热点数据
mySQL里有2000w数据,redis中只存20w的数据,如何保证redis中的数据都是热点数据? 1.限定 Redis 占用的内存,Redis 会根据自身数据淘汰策略,加载热数据到内存.所以,计算 ...
- Spring Security教程之整合SpringMVC(六)
一.前言 Spring Security系列教程中,前五篇为同一人所写,而本文是博主依据第三方文章整合而出,与前五篇文章的作者不是同一系列. 但本文以前五篇文章为基础,在前面文章所建立的Spring ...
- Echart、Excel、highcharts、jfreechart对比
Echart Excel highcharts jfreechart 柱状图 √ √ √ √ 条形图 √ √ √ √ 折线图 √ √ √ √ 面积图 √ √ √ √ 散点图 √ √ √ √ 气泡图 ...