【Ant Design】解决使用日期时间类组件中文汉化无效

antd 解决使用日期时间类组件中文（汉化）部分为生效；
antd 的不同版本可能依赖的时间库也是不一样的，具体的配置还需要参照官网文档；

依赖版本

"dependencies": {
    "antd": "^4.13.1",
    "moment": "^2.30.1",
    "react": "^17.0.1",
},

ConfigProvider

antd 提供了一个 React 组件 ConfigProvider 用于全局配置国际化文案。

import zhCN from 'antd/locale/zh_CN';

return (
  <ConfigProvider locale={zhCN}>
    <App />
  </ConfigProvider>
);

为什么时间类组件的国际化 locale 设置不生效

请检查是否正确设置了 moment 语言包。

后在入口文件 main.jsx 文件里面引入:

import 'moment/dist/locale/zh-cn' 

如果还有问题，请检查是否有两个版本的 moment 共存？

$ npm ls moment

├─┬ antd@4.24.16
│ ├── moment@2.30.1 deduped        
│ └─┬ rc-picker@2.7.6
│   └── moment@2.30.1 deduped      
└── moment@2.30.1

一般来说，如果项目中依赖的 moment 版本和 antd 依赖的 moment 版本 无法兼容（semver 无法匹配，比如项目中的 moment 版本写死且较低），则会导致使用两个不同版本的 momenet 实例，这样也会导致国际化失效。

ps: antd 的不同版本可能依赖的时间库也是不一样的，具体的配置还需要参照官网文档

如果你的 antd 的版本是 v5 以上的版本， 可能需要配置， dayjs 语言包。

import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';

dayjs.locale('zh-cn');

如果还有问题，请检查是否有两个版本的 dayjs 共存？

npm ls dayjs

一般来说，如果项目中依赖的 dayjs 版本和 antd 依赖的 dayjs 版本 无法兼容（semver无法匹配，比如项目中的 dayjs 版本写死且较低），则会导致使用两个不同版本的 dayjs 实例，这样也会导致国际化失效。

注意

antd v5版本的官网的配置也是奇葩，说的 dayjs 不生效，可能是版本不匹配，然后点一下它的链接，结果变成了 moment 的版本：FAQ - Ant Design