Example code in given sandbox link: https://codesandbox.io/s/heuristic-heyrovsky-ys81px?file=/src/App.js

CodePudding user response：

just pass DatePicker props dateFormat.

import "./styles.css";
import React, { useState } from "react";
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
export default function App() {
  const [startDate, setStartDate] = useState(null);
  return (
    <div className="App">
      <DatePicker
        selected={startDate}
        onChange={(date) => setStartDate(date)}
        showTimeSelect
        showTimeSelectOnly
        timeIntervals={60}
        timeCaption="Time"
        timeFormat="HH:mm"
        dateFormat="h:mm aa"
      />
    </div>
  );
}

CodePudding user response：

You can use dateFormat (dateFormat="h:mm") option in the DatePicker.

CodePudding user response：

Replace timeFormat to dateFormat

  <DatePicker
    selected={startDate}
    onChange={(date) => setStartDate(date)}
    showTimeSelect
    showTimeSelectOnly
    timeIntervals={60}
    timeCaption="Time"
    timeFormat="HH:mm"
    dateFormat="HH:mm"
  />

AFter update

for 24H use

    timeFormat="HH:mm"
    dateFormat="HH:mm"