reactjs - 如何在 React 组件中转换日期

Question

我正在尝试将日期和时间转换为更简单的格式，特别是我想了解如何将其转换为：2020-12-20T09:30:00.485Z (UTC) 到此：2020-12-20 10:30 (UTC+1)

在以下 React 组件 ({day.date}) 中：

import React, { useEffect } from 'react';

import { useDispatch, useSelector } from 'react-redux';
import { detailsDate } from '../actions/dateAction';
import LoadingBox from '../components/LoadingBox';
import MessageBox from '../components/MessageBox';

function BookingConfirmationScreen(props) {  

  const dayId = props.match.params.id;

  const dateDetails = useSelector((state) => state.dateDetails);
  const { day, loading, error } = dateDetails;

  const dispatch = useDispatch();
  useEffect(() => {

      dispatch(detailsDate(dayId));
      // eslint-disable-next-line no-console
    return () => {};
  }, [dispatch, dayId]);


  return (
    <div>
      {loading ? (
        <LoadingBox />
    ) : error ? (
      <MessageBox variant="error">{error}</MessageBox>
    ) : (
      
      <h1> Booking {day.date}</h1>
    )}
    </div>
  
  )
}

export default BookingConfirmationScreen;

标签： reactjsdatetimeutc

Answer 1

我建议你看看 date-fns 库。正是针对这种事情：

https://github.com/date-fns/date-fns