JS时间相同的分组显示

html

//相同的时间只能显示一次
<template v-for="(item,index) in arr">
    <div v-if="item.isTrue">{{ item }}</div>
</template>

JS

let arr = [
  {datetime:"2022-10-10 16:37:31"},
  {datetime:"2022-10-10 12:21:06"},
  {datetime:"2022-10-10 02:03:09"},
  {datetime:"2022-10-09 09:17:11"},
  {datetime:"2022-10-09 15:22:19"},
  {datetime:"2022-10-08 08:36:12"},
]
// 获取年月日-时间数组
const newArr = arr.map(item => item.datetime.split(" ")[0])
// 对时间进行去重
const arrSet = new Set(newArr)
// 存放首次出现时间的下标数组
let idList = []
// 根据首次出现时间，将下标进行存储
arrSet.forEach(val => {
  if (newArr.indexOf(val) != -1) {
    idList.push(newArr.indexOf(val))
  }
})
// 与原数组比较，若下标相同，则归为一组
arr.forEach((val, idx) => {
  idList.forEach(val2 => {
    if (idx == val2) {
      //isTrue为分组标志，列表根据isTrue进行分组即可
      val.isTrue = true
    }
  })
})
//拆分时间和日期
for (const key in arr) {
  arr[key].date = arr[key].datetime.split(" ")[0]
  arr[key].time = arr[key].datetime.split(" ")[1]
}
console.log(arr);