vue中對象數(shù)組去重的實現(xiàn)
更新時間：2020年02月06日 15:53:23 作者：靳哲
這篇文章主要介紹了vue中對象數(shù)組去重的實現(xiàn)，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
其實很簡單，一般的數(shù)組去重可以直接用 new Set() 方法即可，但是數(shù)組對象的話，比較復雜，不能直接用，我們可以采取間接的方法來去重
unique(arr) {
const res = new Map();
return arr.filter((arr) => !res.has(arr.id) && res.set(arr.id, 1))
}
下面有一個示例，根據(jù)對象的id作為去重的依據(jù)：
<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));
},
這樣就很簡單的去重了
以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
Vue是一種流行的Web開發(fā)框架,它提供了一個雙向綁定的語法糖。在Vue中,我們可以很容易地獲取頁面上的數(shù)據(jù),并且可以實時的響應其變化,這篇文章主要給大家介紹了關于Vue獲取input值的四種常用方法,需要的朋友可以參考下2023-09-09
這篇文章主要介紹了Vue頁面跳轉(zhuǎn)傳遞參數(shù)及接收方式，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09
這篇文章主要為大家詳細介紹了Vue3導航欄組件封裝的實現(xiàn)方法，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)簡易折疊面板，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
vue v-for 點擊當前行,獲取當前行數(shù)據(jù)及event當前事件對象的操作
這篇文章主要介紹了vue v-for 點擊當前行,獲取當前行數(shù)據(jù)及event當前事件對象的操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09
對于前后端分離的項目,為了統(tǒng)一響應參數(shù),需要將圖片轉(zhuǎn)換成base64的格式,下面這篇文章主要給大家介紹了關于vue圖片轉(zhuǎn)base64格式的相關資料,需要的朋友可以參考下2022-12-12
vue中vite.config.js配置跨域以及環(huán)境配置方式
這篇文章主要介紹了vue中vite.config.js配置跨域以及環(huán)境配置方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04
使用vite創(chuàng)建vue3之vite.config.js的配置方式
這篇文章主要介紹了使用vite創(chuàng)建vue3之vite.config.js的配置方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
element-ui upload組件上傳文件類型限制問題小結(jié)
最近我遇到這樣的問題,接受類型已經(jīng)加了accept 但是當選擇彈出本地選擇文件時候切換到所有文件 之前的文件類型就本根過濾不掉了,下面小編給大家介紹element-ui upload組件上傳文件類型限制問題小結(jié),感興趣的朋友一起看看吧2024-02-02
這篇文章主要介紹了解決Vue @submit 提交后不刷新頁面問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07