Условный рендеринг для строки Datetime в Javascript

Question

Я определил массив дат в Javascript следующим образом:

dates: [
            {id: 1, date: new Date(2020, 1, 4,  9, 0)},
            {id: 2, date: new Date(2020, 30, 4,  9, 0)},
            {id: 3, date: new Date(2020, 1, 5,  9, 0)},
            {id: 4, date: new Date(2020, 2, 3,  9, 0)},
            {id: 5, date: new Date(2020, 5, 5,  9, 0)},
       ]

Я хотел бы сделать условный рендеринг для всего до 12 часов и после 12 часов

if (is after 12pm) {
   return function;
} else {
   return function;
}

Есть ли способ проверить время строки даты? Или есть лучший способ определить даты, а затем проверить дату и время?

Answer 1

Я написал скрипт, который проходит через весь массив и выводит на консоль независимо от того, перед каждой датой предшествует 12 или нет.

Обратите внимание, что я изменил несколько значений в массиве, чтобы получить диапазон дат, некоторые до 12, некоторые после 12 и один в 12 точно.

dates = [
  {id: 1, date: new Date(2020, 1, 4,  13, 0)},
  {id: 2, date: new Date(2020, 30, 4,  9, 0)},
  {id: 3, date: new Date(2020, 1, 5,  12, 0)},
  {id: 4, date: new Date(2020, 2, 3,  22, 0)},
  {id: 5, date: new Date(2020, 5, 5,  9, 0)},
]

for (var i = 0; i < dates.length; i++) {
  
  if (dates[i].date.getHours() < 12) {
    console.log('Before 12.');
  } else {
    console.log('Not before 12.');
  }

}

Answer 2

Используйте момент js библиотека.

var moment = require('moment');

var dates = [
        {id: 1, date: new Date(2020, 1, 4,  9, 0)},
        {id: 2, date: new Date(2020, 30, 4,  9, 0)},
        {id: 3, date: new Date(2020, 1, 5,  9, 0)},
        {id: 4, date: new Date(2020, 2, 3,  9, 0)},
        {id: 5, date: new Date(2020, 5, 5,  9, 0)},
   ]

for(let i = 0; i < dates.length; i++){
  console.log(moment(this.dates[i].date).locale('en').format('hh'));
}

Answer 3

Вы создали объект с двумя ключами id (число) и датой (строка), чтобы создать дату, вы можете использовать класс дат java Сценарий: вы можете использовать функцию Date.prototype.getHours () возвращает час (0–23) в указанную дату в соответствии с местным временем, а затем проверьте значение:

Date.prototype.getHours()

. Посетите эту страницу для получения подробной информации: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getHours