javascript - 反应:material-ui-pickers date-io Jalaali Utils 返回错误:TypeError:utils.getDayText 不是函数
问题描述
这不是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 不是函数
TypeError:utils.getYearText 不是函数
相反,如果我使用 @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
推荐阅读
- linux - 动态初始化由 sed 转换的变量
- python - Django:检查对象是否最后链接到另一个
- xaml - System.Reflection.TargetInvocationException: '调用的目标已抛出异常。' 将 SwipeView 放入 ListView 时
- ldap - Nifi LDAP组成员对用户名区分大小写
- javascript - 为什么应用程序线程(主线程)停止,而 javascript 垃圾收集算法正在运行?
- php - phpspec 全局作曲家安装不工作
- php - 如何对自动捆绑交易进行硬编码?即 4 换 30
- python - python:OperationalError:“%”附近:语法错误
- python-3.x - 列出一个项目导入的所有python模块
- python - 在熊猫中重新采样后进行汇总