застрял в попытке отфильтровать даты в объекте json с помощью React

Question

Я использую React, и мне нужен совет о том, как лучше всего фильтровать даты в объекте JSON, который заполняется из вызова fetch в API.

У меня есть компонент выбора диапазона дат, который устанавливает состояние с выбранными датами. при загрузке страницы данные помещаются в таблицу HTML, когда пользователь выбирает выбранные даты из средства выбора диапазона дат и нажимает кнопку фильтра, мне нужно, чтобы таблица html была обновлена ​​с результатами, которые попадают в промежуток между выбранной датой диапазоны.

мой конструктор имеет начальное состояние:

this.state = {
  bookings: {},
  selectionRange : {
    startDate: new Date(),
    endDate: new Date(),
    key: "selection"
  }
}

Моя кнопка даты для фильтрации дат, моя попытка преобразовать дату из строки в действительную дату.

onbuttonsubmit()  {
  var options = { year: 'numeric', month: 'long', day: 'numeric' };
  console.log("Testing:", new Date(this.state.bookings.FromDate).toLocaleDateString([],options));
}
     
<button onButtonSubmit={this.onbuttonsubmit}>Filter Dates</button>

Я прикрепил изображение, показывающее бронирования {} json:

введите описание изображения здесь

Answer 1

Поскольку FromDate в вашем объекте бронирования является строкой, а фильтры имеют тип Date, вы можете сделать следующее, при условии, что вы хотите выполнить поиск на основе FromDate:

 onbuttonsubmit = () =>  {
    this.setState( { bookings : this.state.bookings.filter( book => new Date(book.FromDate).getTime() >= this.state.startDate.getTime() && new Date(book.FromDate).getTime() <= this.state.endDate.getTime())});
}