typescript 如何更改DatePicker的语言(月和日)?

wrrgggsh  于 2023-05-30  发布在  TypeScript
关注(0)|答案(1)|浏览(131)

如何在Material UI中更改DatePicker(月和日)的语言?
我尝试通过主题和LocalizationProvider实现本地化。局部或全局方式都不起作用。https://mui.com/x/react-date-pickers/localization/enter image description here
我用的是Typescript和MUI v6.5.0

envsm3lx

envsm3lx1#

您提供的the link提供的示例仅说明如何设置MUI组件的本地化。
日期由dayjs生成。您可以使用adapterLocale设置适配器的本地化。如果设置了该属性,则需要从dayjs导入关联的locale
在下面的例子中,我使用了荷兰语,但是你可以把它换成你想用的。

import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
import { DatePicker } from "@mui/x-date-pickers/DatePicker";
import { nlNL } from "@mui/x-date-pickers/locales";

import 'dayjs/locale/nl';

export default function BasicDatePicker() {
  return (
    <LocalizationProvider
      dateAdapter={AdapterDayjs}
      adapterLocale="nl"
      localeText={
        nlNL.components.MuiLocalizationProvider.defaultProps.localeText
      }
    >
      <DatePicker views={['month']} />
    </LocalizationProvider>
  );
}

相关问题