如何将Material-UI TimePicker更改为24小时格式 [英] How to change material-ui timepicker to 24 hour format

问题描述

当前使用material-ui中的 Timepicker .我将其设置为 type ="time" ，这使我可以选择AM/PM选项在一天中的12小时内选择时间.我希望选择器的格式为24小时制，这样可以取消AM/PM选项.我查看了material-ui文档，找不到任何可以解决此问题的方法.

沙盒

当前代码:

 < form className = {classes.container} noValidate>< TextFieldid ="time"label =闹钟"type ="time"className = {classes.textField}InputLabelProps = {{缩小:正确}}inputProps = {{步骤:900//5分钟}}/></form> 

解决方案

它们似乎正在使用@ material-ui/pickers

推荐

https://material-ui-pickers.dev/api/TimePicker

 从'@ material-ui/pickers'导入{TimePicker} 

以下选项应为您完成

  ampm = {false} 

 < TimePicker可清除的ampm = {false}label ="24小时"值= {selectedDate}onChange = {handleDateChange}/> 

如果您需要使用本机选择器，请查看这篇文章 HTML输入时间(以24为单位)格式

Currently using a Timepicker from material-ui. I have it set to type="time" which allows me to select through times during the day in 12 hours with a AM / PM option. I would like to have my picker with a 24-hour format which would remove the AM/PM option. I've looked in the material-ui documentation and could not find anything that could handle this.

Sandbox

Current code:

    <form className={classes.container} noValidate>
      <TextField
        id="time"
        label="Alarm clock"
        type="time"
        className={classes.textField}
        InputLabelProps={{
          shrink: true
        }}
        inputProps={{
          step: 900 // 5 min
        }}
      />
    </form>

解决方案

They seem to be reccomending using @material-ui/pickers

https://material-ui-pickers.dev/api/TimePicker

import { TimePicker } from '@material-ui/pickers'

the following option should do it for you

ampm={false}

   <TimePicker
     clearable
     ampm={false}
     label="24 hours"
     value={selectedDate}
     onChange={handleDateChange}
   />

If you need to use the native picker check out this post HTML input time in 24 format

这篇关于如何将Material-UI TimePicker更改为24小时格式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！