如何在React Big Calendar中将事件时间格式更改为24小时

npm install react-big-calendar

import React from 'react';
import { Calendar, momentLocalizer } from 'react-big-calendar';
import moment from 'moment';

const localizer = momentLocalizer(moment);

const events = [
  {
    title: '事件1',
    start: new Date(2022, 0, 1, 10, 0), // 起始时间，可以使用具体的日期和时间
    end: new Date(2022, 0, 1, 12, 0), // 结束时间，可以使用具体的日期和时间
  },
  // 其他事件...
];

class MyCalendar extends React.Component {
  render() {
    return (
      <div>
        <Calendar
          localizer={localizer} // 使用自定义的本地化实例
          events={events} // 事件数据
          views={['month', 'week', 'day']} // 可用的视图选项
          defaultView="month" // 默认显示的视图
          style={{ height: '500px' }} // 设置日历的高度
          formats={{
            timeGutterFormat: 'H:mm', // 设置时间格式为24小时制
            eventTimeRangeFormat: ({ start, end }) => (
              <span>{moment(start).format('H:mm')} - {moment(end).format('H:mm')}</span> // 设置事件时间格式为24小时制
            ),
          }}
        />
      </div>
    );
  }
}

export default MyCalendar;