Antd DatePicker 語言項-顯示中文月份

官網：https://ant.design/components/date-picker-cn/

如果要顯示中文，官網是這么指導的：

但是，設置后並沒有生效！原因是默認的中文local文件並沒有月份的format格式：

解決：

根據官網local的格式，添加本地local對象即可

import { PickerLocale } from 'antd/es/date-picker/generatePicker';
class LocalHelper {
  getDefinedChineseLocal() {
    let definedChineseLocal: PickerLocale = {
      lang: {
        locale: 'zh_CN',
        placeholder: '請選擇日期',
        rangePlaceholder: ['Start date', 'End date'],
        today: 'Today',
        now: 'Now',
        backToToday: 'Back to today',
        ok: 'Ok',
        clear: 'Clear',
        month: 'Month',
        year: 'Year',
        timeSelect: 'Select time',
        dateSelect: 'Select date',
        monthSelect: 'Choose a month',
        yearSelect: 'Choose a year',
        decadeSelect: 'Choose a decade',
        yearFormat: 'YYYY年',
        dateFormat: 'M/D/YYYY',
        dayFormat: 'D',
        dateTimeFormat: 'M/D/YYYY HH:mm:ss',
        monthFormat: 'M月',
        monthBeforeYear: true,
        previousMonth: 'Previous month (PageUp)',
        nextMonth: 'Next month (PageDown)',
        previousYear: 'Last year (Control + left)',
        nextYear: 'Next year (Control + right)',
        previousDecade: 'Last decade',
        nextDecade: 'Next decade',
        previousCentury: 'Last century',
        nextCentury: 'Next century',
      },
      timePickerLocale: {
        placeholder: 'Select time',
      },
      dateFormat: 'YYYY-MM-DD',
      dateTimeFormat: 'YYYY-MM-DD HH:mm:ss',
      weekFormat: 'YYYY-wo',
      monthFormat: 'YYYY-MM',
    };
    return definedChineseLocal;
  }
}
export const LocalFormat = new LocalHelper();

引用處理：

import React from 'react';
import { DatePicker } from 'antd';
//默認的，不夠用，使用自定義的local
// import locale from 'antd/es/date-picker/locale/zh_CN';
import { LocalFormat } from './localHelper';
import 'antd/dist/antd.css';
import './style.less';

  <DatePicker
    picker="month" locale={LocalFormat.getDefinedChineseLocal()}
    open={this.state.isDefinedDatePopupOpened}
    onChange={(date, dateString) => this.OnDefinedMonthSelected(dateString)}
  />

顯示效果：