微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在回历材料 UI 日期选择器中显示的月份是公历

如何解决在回历材料 UI 日期选择器中显示的月份是公历

我正在使用 Material UI 日期选择器,我们可以选择显示回历日历。问题在于月份选择器中显示的月份是公历(一月、二月等的阿拉伯语翻译),而正确的月份应该是穆哈拉姆、萨法尔等。我如何在其中获得回历月份?我看到了一个具有相同问题的代码和框,我将在此处链接 - https://codesandbox.io/s/7vx23?file=/src/App.js?

enter image description here

解决方法

我扩展了 HijriUtils 库以获得回历月份。在月视图中, utils.format(date,'MMM') 用于获取月份(这是 mi-ui-datepicker 版本 - 3.3.10 与 material-ui 4.x 版本(最新稳定版)、datepicker 兼容是 5.x 中 material-ui 的一部分(仍处于测试阶段)),回历月份格式为“iMMM”。我添加了 format 方法以 Hijri 方式完成它。我们还需要 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);
    }
}

这是更新的代码和框链接 - https://codesandbox.io/s/material-hijri-calendar-forked-y9e68?file=/src/App.js

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。