I am trying to print time in 24hour format using react js. And I have used the below example,which gives 12 hour format. Any ideas to get 24 hr format?

Thanks in Advance

I am trying to print time in 24hour format using react js. And I have used the below example,which gives 12 hour format. Any ideas to get 24 hr format?

https://www.npmjs./package/react-time-picker

Thanks in Advance

• javascript
• reactjs

• Have you tried setting the locale prop to a language that uses 24 hour format? – Václav Zeman Commented Jul 29, 2018 at 19:25
• Nope..iam new to react. how can I use that?I have this <TimePicker onChange={this.onChange} value={this.state.time} /> – ama Commented Jul 29, 2018 at 19:56
• Did my answer work for you? – Tholle Commented Jul 30, 2018 at 15:55

1 Answer 1

You can use a locale prop that uses the 24 hour format instead of the am/pm format.

E.g. Sweden sv-sv uses the 24 hour format.

Example (CodeSandbox)

class App extends Component {
  state = {
    time: "10:00"
  };

  onChange = time => this.setState({ time });

  render() {
    return (
      <div style={{ marginTop: "200px" }}>
        <TimePicker
          onChange={this.onChange}
          value={this.state.time}
          locale="sv-sv"
        />
      </div>
    );
  }
}