Блог

Главная - Вопросы по программированию - Невозможно отсортировать массив по дате с помощью React

Невозможно отсортировать массив по дате с помощью React

#javascript #reactjs

#javascript #reactjs

Вопрос:

Я не могу отсортировать массив по дате. Я пробовал много разных вещей, но не смог заставить его работать. Массив состоит из объектов с last_updated полем, которое имеет значение, отформатированное следующим образом: 24/1/2021 @ 13:21:2 .

Я попытался отсортировать массив перед выполнением .map() :

 chats.sort(function (a, b) {
  return (
    new Date(b.last_update) - new Date(a.last_update)
  );
});

Это не работает, и я, честно говоря, не знаю почему. Это из @ -за даты?

Ответ №1:

Попробуйте это:

 chats.sort(function (a, b) {
  return new Date(b.last_update).getTime() - new Date(a.last_update).getTime();
});

Ответ №2:

 const chats = [
  { title: 'Hiking', last_updated: new Date('2019-06-28') },
  { title: 'Shopping', last_updated: new Date('2019-06-10') },
  { title: 'Trekking', last_updated: new Date('2019-06-22') }
]

const sorted = chats.sort((a, b) => b.last_updated - a.last_updated)

console.log(sorted);

Ответ №3:

Да, это потому, что вы не можете проанализировать свою отформатированную дату с new Date помощью . Оба 24/1/2021 @ 13:21:2 и 24/1/2021 13:21:2 возвращают недопустимую дату, если вы попытаетесь их проанализировать.

Вы можете либо обновить способ хранения этих дат, либо проанализировать дату, прежде чем пытаться их отсортировать. Если вы не можете сохранить их в другом формате (например, ISO 8601), я бы, вероятно, использовал date-fns/parse для анализа даты пользовательский форматировщик. Смотрите пример ниже:

 import parse from 'date-fns/parse'

const chats = [
  { message: 'facilis consectetur, error sequi excepturi', last_updated: '24/1/2021 @ 13:21:2' },
  { message: 'sit amet consectetur adipisicing elit', last_updated: '24/1/2021 @ 13:20:14' },
  { message: 'mollitia unde fugiat delectus sunt ducimus', last_updated: '24/1/2021 @ 13:22:4' }
]

const format = 'd/M/y @ H:m:s'
const parseDate = d => parse(d, format, new Date())

chats.sort((a, b) => parseDate(b.last_updated) - parseDate(a.last_updated))

// it returns the following array:
// 
// [
//   {last_updated: "24/1/2021 @ 13:22:4", message: "mollitia unde fugiat delectus sunt ducimus"},
//   {last_updated: "24/1/2021 @ 13:21:2", message: "facilis consectetur, error sequi excepturi"},
//   {last_updated: "24/1/2021 @ 13:20:14", message: "sit amet consectetur adipisicing elit"}
// ]
Метки: