Reactjs:如何创建时间选择器

npm install react-datepicker --save

import React, { useState } from 'react';
import DatePicker from 'react-datepicker';
import 'react-datepicker/dist/react-datepicker.css';

const TimePicker = () => {
  const [selectedTime, setSelectedTime] = useState(null);

  const handleTimeChange = (time) => {
    setSelectedTime(time);
  };

  return (
    <div>
      <DatePicker
        selected={selectedTime}
        onChange={handleTimeChange}
        showTimeSelect
        showTimeSelectOnly
        timeIntervals={15}
        dateFormat="h:mm aa"
      />
    </div>
  );
};

export default TimePicker;

import React from 'react';
import TimePicker from './TimePicker';

const App = () => {
  return (
    <div>
      <h1>时间选择器示例</h1>
      <TimePicker />
    </div>
  );
};

export default App;