javascript - React : material-ui-pickers date-io Jalaali Utils returns error : TypeError: utils. getDayText 不是函数

标签 javascript reactjs datepicker material-ui

这不是 https://github.com/mui-org/material-ui-pickers/issues/1440 的重复因为我对原来的用法没有任何问题。
根据这里的链接https://material-ui-pickers.dev/localization/calendar-systems我使用了 @date-io/jalaali 中的 JalaliUtils。这是我的代码,您可以看到我使用了两个不同的实用程序,其中使用 JalaaliUtils 时出现两个错误:

TypeError: utils.getDayText is not a function

TypeError: utils.getYearText is not a function

相反,如果我使用 @date-io/moment 中的 MomentUtils ,它就可以正常工作,但这不是我想要的。 包本身有什么错误吗?

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

jMoment.loadPersian({ dialect: "persian-modern", usePersianDigits: true });

function PersianExample() {
  const [selectedDate, handleDateChange] = useState(moment());

  return (
    <React.Fragment>
      <MuiPickersUtilsProvider utils={JalaliUtils} locale="fa">
        <DatePicker
          clearable
          okLabel="ok"
          cancelLabel="cancel"
          clearLabel="clear"
          labelFunc={date => (date ? date.format("jYYYY/jMM/jDD") : "")}
          value={selectedDate}
          onChange={handleDateChange}
        />
      </MuiPickersUtilsProvider>
      <MuiPickersUtilsProvider utils={MomentUtils}>
        <DatePicker value={selectedDate} onChange={handleDateChange} />
      </MuiPickersUtilsProvider>
    </React.Fragment>
  );
}

export default PersianExample;

我的package.json

{
  "name": "search-documents",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@apollo/react-hooks": "^3.1.3",
    "@date-io/date-fns": "1.x",
    "@date-io/dayjs": "1.x",
    "@date-io/jalaali": "^2.3.0",
    "@date-io/moment": "1.x",
    "@material-ui/core": "^4.8.3",
    "@material-ui/icons": "^4.5.1",
    "@material-ui/pickers": "^3.2.10",
    "@reduxjs/toolkit": "^1.2.3",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "@types/apollo-upload-client": "^8.1.3",
    "@types/jest": "^24.0.0",
    "@types/moment-jalaali": "^0.7.4",
    "@types/node": "^12.0.0",
    "@types/react": "^16.9.19",
    "@types/react-dom": "^16.9.0",
    "@types/react-redux": "^7.1.7",
    "@types/react-router-dom": "^5.1.3",
    "apollo-boost": "^0.4.7",
    "apollo-upload-client": "^12.1.0",
    "crypto-js": "^3.1.9-1",
    "date-fns": "^2.9.0",
    "dayjs": "^1.8.20",
    "graphql": "^14.5.8",
    "jss-rtl": "^0.3.0",
    "moment": "^2.24.0",
    "moment-jalaali": "^0.9.1",
    "react": "^16.12.0",
    "react-advance-jalaali-datepicker": "^1.2.2",
    "react-apollo": "^3.1.3",
    "react-dom": "^16.12.0",
    "react-redux": "^7.1.3",
    "react-relay": "^8.0.0",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.3.0",
    "redux": "^4.0.5",
    "typescript": "~3.7.2",
    "yup": "^0.28.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

最佳答案

使用1.x版本npm install @date-io/jalaali@1.x

关于javascript - React : material-ui-pickers date-io Jalaali Utils returns error : TypeError: utils. getDayText 不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60129024/

相关文章:

javascript - 如何在触摸启动/按住时删除 chrome 中的默认框轮廓动画?

javascript - 检查当前 url 中的特定 uri - Jquery

javascript - 获取光标书写位置

javascript - React 组件必须在层次结构中吗?

silverlight - 如何更改 Silverlight DatePicker 控件中的日期格式?

javascript - Materialise datepicker - 单击图标时呈现

iphone - DatePicker 值即使更改后也不会更改

javascript - 视频标签的高度,取决于屏幕的宽度

javascript - 返回 [对象,对象] 的工具提示

reactjs - 如何在 React Native(expo)中创建文本文件?