Проблемы с преобразованием часового пояса и даты

У меня есть простая система, которая в форме создания узла позволяет пользователю выбирать даты начала и окончания, а также часы и минуты:

Проблема в том, что дата сбивается где-то посередине, или я не знаю, как ее преобразовать.

В базе данных сохраняются два значения следующим образом:

start: "2019-08-01T14:00:00.000Z"
end: "2019-08-01T16:00:00.000Z"

Кажется правильным, так как в средстве выбора даты я выбрал 14:00 и 16:00. Затем, используя momentjs и react-big-calendar, я пытаюсь поместить это событие в календарь. Вроде каждый раз +3 часа ставит. Я предполагаю, что это потому, что он сохраняет его в формате UTC, а я живу в Восточной Европе, что составляет +3 часа от UTC.

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

Что странно, так это то, что я уже получаю обратное время, преобразованное в свое собственное, когда я делаю запрос к базе данных:

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

Thu Aug 01 2019 17:00:00 GMT+0300 (Eastern European Summer Time)

Может ли кто-нибудь помочь мне? Я ожидаю, что те же часы будут возвращены и отображены, поскольку я их сохраняю, то есть, если я выберу 14:00, это должно быть 14:00. Я думаю, что решение здесь будет состоять в том, чтобы игнорировать часовые пояса и всегда отображать все в формате UTC? Но как это сделать? У меня есть доступ к momentjs, если это поможет. Я пробовал что-то вроде этого:

moment.utc(event.start);

Но он по-прежнему возвращает одно и то же значение, а именно:

Thu Aug 01 2019 17:00:00 GMT+0300 (Eastern European Summer Time)

react-big-calendar utc momentjs
person Kelb56    schedule 14.08.2019    source источник
comment
Возможно, ваша база данных настроена на время UTC+3? Какую базу данных вы используете и можете ли вы попробовать изменить конфигурацию базы данных для работы в формате UTC? (вам это важно?)   -  person caladeve    schedule 16.08.2019
comment
Вы пробовали moment.utc().zone(3).format() или moment().format()   -  person Jargal    schedule 23.09.2019

Ответы (1)


arrow_upward
3
arrow_downward

Когда вы настраиваете React-Big-Calendar, вы определяете локализатор. По умолчанию календарь будет отображаться в местном часовом поясе браузера, который использует пользователь. Любые и все даты, указанные в календаре, будут преобразованы в этот местный часовой пояс. Если ваши даты, полученные из БД, используют смещение +5, но вы сидите в +3, это автоматически преобразует это время в отображение +3 (часть красоты UTC).

Вот где это может быть сложно. Скажем, я хочу получить все значения из моей базы данных в период с 19 по 21 сентября. Я должен помнить эти смещения при запросе данных из системы. Я мог бы использовать момент и сказать moment('2019-09-19').startOf('day'), и это дало бы мне 2019-09-19T00:00:00Z, но это не совсем правильно для меня, так как я нахожусь в смещении -5, что означает, что мне действительно нужно 2019-09-18T19:00:00Z, чтобы начать мой день. То же самое относится и к моей конечной дате и времени, где я бы сказал moment('2019-09-21').endOf('day'), и это дало бы мне 2019-09-21T23:59:59Z, когда мне нужно было бы 2019-09-21T18:59:59Z.

Теперь я не уверен в этом (вам придется провести некоторое тестирование), но если вы используете moment-timezone вместо moment, он может справиться со всем этим за вас. Вам придется поиграть, чтобы знать наверняка.

ПОСЛЕДНИЕ РЕДАКТИРОВАНИЯ: я разработал обработку часовых поясов с помощью moment-timezone в качестве локализатора. Я поместил все это в проект GitHub, а также создал CodeSandbox, где люди могут поиграть с ним.

person Steve -Cutter- Blades    schedule 23.09.2019
comment
Спасибо за пример CodeSandbox, это спасло меня! - person Albert Hidalgo; 04.02.2021
comment
@AlbertHidalgo, вы должны знать, что в этом примере все еще есть проблемы, в зависимости от диапазона времени, который вы показываете в представлениях «время», и от вашего смещения. Настоящего ответа пока нет (см. Issue github.com/jquense/react-big -calendar/issues/1478), но, надеюсь, в конечном итоге мы сможем получить полную поддержку от РБК. - person Steve -Cutter- Blades; 04.02.2021
comment
Для того, что мне нужно, это работает для меня, мне просто нужно повысить то, с чего начать. - person Albert Hidalgo; 05.02.2021