更改格式日期日期(材料-UI)

Question

我想更改 DatePicker上日期的格式（材料-UI-pickers），但是当我使用 formatDate功能时，日期的格式不会改变，但仍然只显示月和日期，而不是选定的年。

这是我的代码：

<DatePicker
  margin="normal"
  disableFuture
  openTo="year"
  views={["year", "month", "day"]}
  value={selectedDate}
  onChange={this.handleDateChange}
  maxDate={maxdate}
  formatDate={(date) => moment(date).format('DD-MM-YYYY')}
/>

Answer 1

2022方法是：

<DatePicker inputFormat="MM/dd/yyyy" />

Answer 2

更改日期格式的道具称为 format，并取为字符串而不是函数。

<DatePicker
  margin="normal"
  disableFuture
  openTo="year"
  views={["year", "month", "day"]}
  value={selectedDate}
  onChange={this.handleDateChange}
  maxDate={maxdate}
  format="DD-MM-YYYY"
/>

Answer 3

尝试以下：

<DatePicker inputFormat="DD/MM/YYYY" views={["day", "month", "year"]} 
value={value} onChange {(newValue) => {setValue(newValue);}} />

Answer 4

  <LocalizationProvider dateAdapter={AdapterDateFns}>
                                    <DateTimePicker
                                        renderInput={(props) => <TextField  variant="standard"  className="w-100" required {...props} />}
                                        label="voyage Start Date"
                                        value={formik.values?.voyageStartDate}
                                        onChange={(newValue) => {
                                           formik.setFieldValue("voyageStartDate",moment(newValue).format("YYYY-MM-DD HH:mm:ss"))
                                        }}
                                        onKeyPress={() => formik.setFieldTouched("voyageStartDate")}
                                    />
                                </LocalizationProvider>

Answer 5

对于 2022 解决方案是ampm={false}参数

<DateTimePicker
  ampm={false}
  renderInput={...}
/>

检查MUI-X doc

Answer 6

2023解决方案尝试此

 <DatePicker
     className="w-160"
     clearable
     slotProps={dateProps('Start Date')}
     format="dd-MM-yy"
    />

您的日期和年应在小Casae中