Tencent / Tencent/tdesign-react

[DatePicker] format 属性使用时好像没有使用国际化

Open
#3,444 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

🐞 bug
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日。

Image

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

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.