Skip to content

Conversation

@shumuuu
Copy link

@shumuuu shumuuu commented Nov 2, 2025

🤔 这个 PR 的性质是?

  • 日常 bug 修复
  • 新特性提交
  • 文档改进
  • 演示代码改进
  • 组件样式/交互改进
  • CI/CD 改进
  • 重构
  • 代码风格优化
  • 测试用例
  • 分支合并
  • 其他

🔗 相关 Issue

当前pr修复的问题在tdesign-vuetdesign-vue-next两个仓库中均存在,我已经向这两个仓库提交了pr。考虑到web端组件逻辑复用于是过来这边检查,发现tdesign-react仓库同样存在上述仓库中的问题,故同步更正

💡 需求背景和解决方案

由于web端组件逻辑复用,故需求和解决方案类似,见tdesign-vue#3759tdesign-vue-next#6045

代码缺陷

其一,组件源码中的月份禁用选项生成依据仅为先起始年份后终止年份的单侧判断

// packages\components\calendar\Calendar.tsx L197~204
if (yearIn === beginYear) {
  const beginMon = parseInt(dayjs(rangeFromTo.from).format('M'), 10);
  return monthIn < beginMon;
}
if (yearIn === endYear) {
  const endMon = parseInt(dayjs(rangeFromTo.to).format('M'), 10);
  return monthIn > endMon;
}

只有在切换年份时才会触发月份的禁用选项更新。当起止年份相同时(假定为2025年),若年份选中2025年,以上逻辑仅会判断当前选中项与起始年份相同然后禁用起始月份之前的月份选项,而忽略对终止月份之后的月份选项的禁用

其二,生成年份选项时多余且错误地调用了checkMonthAndYearSelectorDisabled函数来判断年份选项的禁用状态。年份选项生成一定在范围内,无需额外编写禁用状态逻辑;且checkMonthAndYearSelectorDisabled函数是用于月份选项禁用范围的判定,用于年份选项会导致实际可选择范围异常

// packages\components\calendar\Calendar.tsx L214~219
for (let i = yearBegin; i <= yearEnd; i++) {
  yearList.push({
    value: i,
    disabled: checkMonthSelectorDisabled(i, month),
  });
}

解决方案

其一

// packages\components\calendar\Calendar.tsx L195~211
// 读取起止年份
const beginYear = dayjs(rangeFromTo.from).year();
const endYear = dayjs(rangeFromTo.to).year();
// 读取起止月份
const beginMon = parseInt(dayjs(rangeFromTo.from).format('M'), 10);
const endMon = parseInt(dayjs(rangeFromTo.to).format('M'), 10);

if (beginYear === endYear) {
  // 同一年内,禁用开始月份至结束月份之外的月份选项
  return monthIn < beginMon || monthIn > endMon;
}
if (yearIn === beginYear) {
  return monthIn < beginMon;
}
if (yearIn === endYear) {
  return monthIn > endMon;
}

将可复用的月份处理逻辑提前,然后在单侧判断之前增加一个分支逻辑判断起止年份是否相同,相同的话将禁用的月份选项设定为在起止月份之外的即可

其二,删去多余的禁用状态逻辑,固定启用所有年份选项

image

📝 更新日志

  • fix(Calendar): 修复当 range 为同一年内时,终止月份之后的月份选项没有正常禁用的问题

  • fix(Calendar): 修复年份选项错误地使用了月份选项禁用范围判定逻辑的问题

  • 本条 PR 不需要纳入 Changelog

☑️ 请求合并前的自查清单

⚠️ 请自检并全部勾选全部选项⚠️

  • 文档已补充或无须补充
  • 代码演示已提供或无须提供
  • TypeScript 定义已补充或无须补充
  • Changelog 已提供或无须提供

@shumuuu
Copy link
Author

shumuuu commented Nov 2, 2025

因为是通病,不确定是否需要在当前仓库再开一个issue,如有需要我再开

@RylanBot RylanBot requested a review from Copilot November 2, 2025 12:22
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR improves month selector validation logic in the Calendar component to handle same-year date ranges correctly. Previously, when the date range started and ended in the same year, the month selector didn't properly restrict available months.

  • Added special case handling for same-year date ranges
  • Optimized variable scope by moving beginMon and endMon calculations outside conditional blocks
  • Changed year selector items to never be disabled (always false)

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@pkg-pr-new
Copy link

pkg-pr-new bot commented Nov 2, 2025

tdesign-react-demo

npm i https://pkg.pr.new/tdesign-react@3938

commit: 5d9d073

@github-actions
Copy link
Contributor

github-actions bot commented Nov 2, 2025

完成

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants