Выбор материалов-пользовательского интерфейса: отображать дату как (М, ДД, ГГГГ) -> (17 апреля 2019 г.)

Question

Это библиотека Material-Ui Pickers: https://material-ui-pickers.dev/api/datepicker

Как вы можете видеть, кажется возможным отображать дату в виде строки (Месяц) или в виде даты (ММ / ДД / ГГГГ), однако я не могу найти ничего, что позволило бы мне отображать дату как (Месяц ДД, ГГГГ), это возможно, я что-то упустил?

Answer 1

Вот пример использования момента:

import React, { useState } from 'react';
import moment from 'moment';
import { MuiPickersUtilsProvider, DatePicker } from 'material-ui-pickers';
import MomentUtils from '@date-io/moment';

class LocalizedUtils extends MomentUtils {
  getDatePickerHeaderText(date) {
    return moment(date).format('ll');
  }
}

function DateLocalizationExample() {
  const [selectedDate, handleDateChange] = useState(new Date());

  return (
    <MuiPickersUtilsProvider utils={LocalizedUtils}>
      <DatePicker
        clearable
        helperText="moment"
        format="ll"
        value={selectedDate}
        onChange={handleDateChange}
        clearLabel="vider"
        cancelLabel="annuler"
      />
    </MuiPickersUtilsProvider>
  );
}

export default DateLocalizationExample;

Answer 2

Похоже, материал использует либо Moment.js, либо Date.fns, вы должны использовать стандарт формата для любой используемой вами библиотеки. Например, Момент использует MMMM Do YYYY

Answer 3

Ты можешь использовать format prop, чтобы переопределить формат прямо в текстовом поле.

А также вы можете воспользоваться преимуществами глобального руководства по настройке формата. Это позволяет изменять форматы непосредственно в модальном диалоге выбора даты / времени.