vue 對象數組中,相鄰的且相同類型和內容的數據合併,重組新的數組對象

在項目中,有時候會遇到一些需求,比如行程安排,或者考勤狀態。後臺返回的獲取是這一週的每一天的狀態,但是我們前端需求顯示就是要把相鄰的且狀態相同的數據進行合併,所以我們就要重新組合返回的數據。

源數據:

let data = [
  {"TYPE": "01", "REMARK": "休假"},
  {"TYPE": "03", "REMARK": "在班"},
  {"TYPE": "03", "REMARK": "在班"},
  {"TYPE": "02", "REMARK": "上海出差"},
  {"TYPE": "02", "REMARK": "北京出差"},
  {"TYPE": "04", "REMARK": "休息"},
  {"TYPE": "04", "REMARK": "休息"}
]

目標數據:

let target = [
  {"TYPE": "01", "REMARK": "休假", "KEY": "01休假", "COUNT": 1},
  {"TYPE": "03", "REMARK": "在班", "KEY": "03在班", "COUNT": 2},
  {"TYPE": "02", "REMARK": "上海出差", "KEY": "02上海出差", "COUNT": 1},
  {"TYPE": "02", "REMARK": "北京出差", "KEY": "02北京出差", "COUNT": 1},
  {"TYPE": "04", "REMARK": "休息", "KEY": "04休息", "COUNT": 2}
]

我們可以通過 TYPE 和 REMARK 兩個 key 對應的 value 共同決定是否合併屬性,代碼如下:

let newdata = []
let index = 1;
let i = 0;
for(let k in data){
  let {TYPE,REMARK} = data[i];
  let {TYPE:TYPE2,REMARK:REMARK2} = data[i+1]||{}
  i++;
  if(TYPE==TYPE2 && REMARK==REMARK2){   //類型相同且內容相同
    index++;
  }else{
    newdata.push({
      ...data[k],
      KEY:TYPE+REMARK,
      COUNT:index
    })
    index = 1;
  }
}
console.log(newdata)

更多案例:vue 對象數組中,根據相同屬性的數據合併,重組新的數組對象

發佈了85 篇原創文章 · 獲贊 37 · 訪問量 15萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章