Tencent / Tencent/tdesign-react
[DatePicker] format 属性使用时好像没有使用国际化
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 965
- Forks
- 373
- Avg merge
- 3d 6h
- Merged PRs (30d)
- 17
Description
tdesign-react 版本
1.1.1
重现链接
https://stackblitz.com/edit/txm6axnw-lzjqzkzd?file=src%2Fdemo.tsx
重现步骤
在英语环境(import enConfig from 'tdesign-react/es/locale/en_US';), 使用 <DatePicker format="MMM, YYYY" />, 若选中2025年3月7日。
demo.tsx源码,供重现链接不好用时使用。
import React, { useState,useMemo } from 'react';
import dayjs from 'dayjs';
import {ConfigProvider, DatePicker, Space } from 'tdesign-react';
import enConfig from 'tdesign-react/es/locale/en_US';
const dateDisplayFOrmat= 'MMM,YYYY';
const valueType="YYYY-MM-DD";
export default function YearDatePicker() {
const [date,setDate] = useState('2025-03-07');
const onChange=(v)=>{
console.log('onChange:',v)
setDate(v)
}
const displayDate = useMemo(()=>{
return dayjs(date, valueType).format(dateDisplayFOrmat);
},[date]);
return (
<ConfigProvider globalConfig={enConfig}>
<Space direction="vertical">
<DatePicker
mode="month"
value={date}
onChange={onChange}
valueType= {valueType}
format="MMM,YYYY"
/>
<span>value: {date}</span>
<span>Formatted: {displayDate}</span>
</Space>
</ConfigProvider>
);
}
期望结果
期望显示Mar, 2025
实际结果
3月,2025
框架版本
No response
浏览器版本
No response
系统版本
No response
Node版本
No response
补充说明
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the DatePicker usage shown in demo.tsx and reproduce the issue using ConfigProvider with enConfig, mode="month", and format="MMM,YYYY". Trace how the format attribute obtains its month names and compare the displayed result with the expected "Mar, 2025" output; done means the English locale is reflected in the DatePicker display.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend, internationalization
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100