ant-design / ant-design/pro-components
🐛[BUG] ProTable.ProColumns.FieldProps.Format is not localizable.
- Dominant language
- TypeScript
- Stars
- 4.8k
- Forks
- 1.4k
- Avg merge
- 10h 44m
- Merged PRs (30d)
- 3
Description
```
export const useApplicationTableColumns = (): ProColumns[] => {
return [
{
title: 'Creation Date',
dataIndex: 'creationDate',
valueType: 'dateTime',
fieldProps: {
format: 'L'
}
}
];
};
```
console.log(record.creationDate);
--> "creationDate": "2023-07-03T12:54:28",
Screenshots.

config.ts
```
moment2dayjs: {
preset: 'antd',
plugins: ['duration', 'advancedFormat', 'localeData', 'localizedFormat', 'utc', 'timezone'],
},
```
package.json
```
"dependencies": {
"@ant-design/icons": "^4.8.0",
"@ant-design/pro-components": "^2.6.4",
"@ant-design/use-emotion-css": "1.0.4",
"@umijs/route-utils": "^2.2.2",
"ahooks": "^3.7.8",
"antd": "^5.6.4",
"classnames": "^2.3.2",
"lodash": "^4.17.21",
"moment": "^2.29.4",
"omit.js": "^2.0.2",
"querystring": "^0.2.1",
"rc-menu": "^9.9.2",
"rc-util": "^5.32.2",
"react": "^18.2.0",
"react-dev-inspector": "^1.8.4",
"react-dom": "^18.2.0",
"react-helmet-async": "^1.3.0"
},
"devDependencies": {
"@ant-design/pro-cli": "^2.1.5",
"@testing-library/react": "^13.4.0",
"@types/classnames": "^2.3.1",
"@types/express": "^4.17.17",
"@types/history": "^4.7.11",
"@types/jest": "^29.5.1",
"@types/lodash": "^4.14.195",
"@types/react": "^18.2.7",
"@types/react-dom": "^18.2.4",
"@types/react-helmet": "^6.1.6",
"@umijs/fabric": "^2.14.1",
"@umijs/lint": "^4.0.72",
"@umijs/max": "^4.0.72",
"cross-env": "^7.0.3",
"eslint": "^8.41.0",
"express": "^4.18.2",
"gh-pages": "^3.2.3",
"husky": "^7.0.4",
"jest": "^29.5.0",
"jest-environment-jsdom": "^29.5.0",
"lint-staged": "^10.5.4",
"mockjs": "^1.1.0",
"prettier": "^2.8.8",
"swagger-ui-dist": "^4.19.0",
"ts-node": "^10.9.1",
"typescript": "^5.0.0",
"umi-presets-pro": "^2.0.3"
},
"engines": {
"node": ">=12.0.0"
}
```
Contributor guide
Research direction
Start with the ProTable ProColumns fieldProps format behavior described in the example, then trace how the supplied date value and locale configuration are handled. Verify the behavior with the shown Creation Date column and define done as making its displayed format respond correctly to localization, with a regression test if the relevant test area is identified.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 30/100