在Hijri Material UI日期选择器中，显示的月份为公历

Question

我正在使用材料UI日期选择器，我们可以选择显示Hijri日历。问题是在月份选择器中显示的月份是公历(1月，2月等的阿拉伯语翻译)，而正确的月份应该是Muharram，Safar等。我怎么才能把Hijri月份放进去呢？我看到了一个有同样问题的codesandbox，我将在这里链接它- https://codesandbox.io/s/7vx23?file=/src/App.js

​

​

Answer 1

我扩展了HijriUtils库以获得Hijri月。在月份视图中，utils.format(日期，'MMM')用于获取月份(这是mi-ui-datepicker版本- 3.3.10，它与material-ui 4.x版本(最新稳定版)兼容，datepicker是material-ui 5.x版本(仍在测试中)的一部分)，moment hijri Month格式为'iMMM‘。我用Hijri的方式添加了format方法。我们还需要HijriUtils中的getMonthArray、setMonth方法来正确获取/设置月份。

export default class HijriUtilsExtended extends HijriUtils {
// Get the months array in hijri.
    getMonthArray = function (date) {
      const firstMonth = date.clone().locale(this.locale).startOf("iYear");
      const monthArray = [firstMonth];
  
        while (monthArray.length < 12) {
          const prevMonth = monthArray[monthArray.length - 1];
          monthArray.push(prevMonth.clone().add(1, "iMonth"));
        }
  
        return monthArray;
    }
    // Set month in Hijri.
    setMonth = function (date, count) {
        return date.clone().iMonth(count);
    };
     
    format = function (date, format) {
      return format === 'MMM' ? date.format('iMMM') : date.format(format);
    }
}

以下是更新后的codesandbox链接- https://codesandbox.io/s/material-hijri-calendar-forked-y9e68?file=/src/App.js