Skip to content

fix(Select): fix stale input and option flicker in filterable mode - #4388

Merged
uyarn merged 5 commits into
developfrom
fix/select-filterable-composing-input
Sep 4, 2026
Merged

fix(Select): fix stale input and option flicker in filterable mode#4388
uyarn merged 5 commits into
developfrom
fix/select-filterable-composing-input

Conversation

@RSS1102

@RSS1102 RSS1102 commented Sep 3, 2026

Copy link
Copy Markdown
Collaborator

🤔 这个 PR 的性质是?

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

🔗 相关 Issue

https://tdesign.tencent.com/react/components/select#可过滤的选择器

#4382

💡 需求背景和解决方案

修复前

  • 使用中文输入法筛选并选中选项后,Select 会清空筛选词;Input 的 composingValue 仍可能保留上一次的合成内容。
  • 再次聚焦并开始输入时,旧内容会被带回并与本次输入拼接。
  • 选中筛选结果后,面板进入关闭动画,但筛选词已被清空,列表可能短暂恢复为全部选项。

修复方案

  • composition 开始时,以输入框当前 DOM 值重置 composingValue,让下一次合成输入从实际显示内容开始。
  • 面板关闭时记录最后一次可见的筛选列表,在退出动画结束前继续使用该列表;重新打开面板时仍使用最新候选项。

修复结果

  • 选中后再次使用中文输入法时,不再残留或拼接上一次的筛选内容。
  • 关闭动画期间保持筛选后的列表,不再短暂显示完整列表;选中值、回显和现有 API 行为保持不变。

📝 更新日志

tdesign-react

  • fix(Select): 修复 filterable 下中文输入法筛选选中后再次输入会残留上次筛选内容的问题
  • fix(Select): 修复 filterable 选择选项后关闭面板时短暂显示完整列表的问题

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

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

Input 在合成输入(composition)期间使用内部状态 composingValue 渲染,外部 value 被程序清空时该状态不会同步。Select 选中选项后会清空筛选词,但 composingValue 仍保留上一次的合成内容,导致再次聚焦进入合成态时,输入框回显旧内容并在其后累加新输入。

- fix(Input): 合成输入开始时以输入框当前内容为起点重置 composingValue
- test: 补充 Input 受控清空后再次合成输入、Select filterable 中文输入法筛选的回归测试

closes #4382
@github-actions

github-actions Bot commented Sep 3, 2026

Copy link
Copy Markdown
Contributor

Size Change: 0 B

Total Size: 115 kB

ℹ️ View Unchanged
Filename Size
packages/tdesign-react-aigc/es/_chunks/dep-a956212b.js 92.6 kB
packages/tdesign-react-aigc/es/_util/reactify.js 3.89 kB
packages/tdesign-react-aigc/es/_util/useDynamicStyle.js 615 B
packages/tdesign-react-aigc/es/attachments/index.js 354 B
packages/tdesign-react-aigc/es/chat-actionbar/index.js 360 B
packages/tdesign-react-aigc/es/chat-engine/components/activity/index.js 285 B
packages/tdesign-react-aigc/es/chat-engine/components/activity/registry.js 1.01 kB
packages/tdesign-react-aigc/es/chat-engine/components/activity/render.js 1.62 kB
packages/tdesign-react-aigc/es/chat-engine/components/activity/types.js 106 B
packages/tdesign-react-aigc/es/chat-engine/components/index.js 490 B
packages/tdesign-react-aigc/es/chat-engine/components/provider/agent-state.js 556 B
packages/tdesign-react-aigc/es/chat-engine/components/toolcall/index.js 422 B
packages/tdesign-react-aigc/es/chat-engine/components/toolcall/registry.js 969 B
packages/tdesign-react-aigc/es/chat-engine/components/toolcall/render.js 2.86 kB
packages/tdesign-react-aigc/es/chat-engine/components/toolcall/types.js 208 B
packages/tdesign-react-aigc/es/chat-engine/hooks/index.js 434 B
packages/tdesign-react-aigc/es/chat-engine/hooks/useAgentActivity.js 841 B
packages/tdesign-react-aigc/es/chat-engine/hooks/useAgentState.js 1.29 kB
packages/tdesign-react-aigc/es/chat-engine/hooks/useAgentToolcall.js 851 B
packages/tdesign-react-aigc/es/chat-engine/hooks/useChat.js 933 B
packages/tdesign-react-aigc/es/chat-engine/index.js 770 B
packages/tdesign-react-aigc/es/chat-filecard/index.js 354 B
packages/tdesign-react-aigc/es/chat-loading/index.js 360 B
packages/tdesign-react-aigc/es/chat-markdown/index.js 406 B
packages/tdesign-react-aigc/es/chat-message/index.js 367 B
packages/tdesign-react-aigc/es/chat-sender/index.js 359 B
packages/tdesign-react-aigc/es/chat-thinking/index.js 387 B
packages/tdesign-react-aigc/es/chatbot/index.js 426 B
packages/tdesign-react-aigc/es/index.js 998 B
packages/tdesign-react-aigc/es/style/index.js 146 B

compressed-size-action::tdesign-react-chat

@tdesign-bot

tdesign-bot commented Sep 3, 2026

Copy link
Copy Markdown
Collaborator

TDesign Component Site Preview Open

Component Preview
tdesign-react 完成
@tdesign-react/chat 完成

@pkg-pr-new

pkg-pr-new Bot commented Sep 3, 2026

Copy link
Copy Markdown
  • tdesign-react-demo

    npm i https://pkg.pr.new/Tencent/tdesign-react@4388
    
    npm i https://pkg.pr.new/Tencent/tdesign-react/@tdesign-react/chat@4388
    

commit: 9bc4167

@github-actions

github-actions Bot commented Sep 3, 2026

Copy link
Copy Markdown
Contributor

Size Change: +111 B (+0.01%)

Total Size: 932 kB

📦 View Changed
Filename Size Change
packages/tdesign-react/dist/tdesign.js 514 kB +69 B (+0.01%)
packages/tdesign-react/dist/tdesign.min.js 301 kB +42 B (+0.01%)
ℹ️ View Unchanged
Filename Size
packages/tdesign-react/dist/reset.css 1.93 kB
packages/tdesign-react/dist/tdesign.css 61 kB
packages/tdesign-react/dist/tdesign.min.css 55.2 kB

compressed-size-action::tdesign-react

@RylanBot RylanBot added the WIP work in porgess label Sep 3, 2026
@RSS1102
RSS1102 force-pushed the fix/select-filterable-composing-input branch from 99d6dc8 to d5fece7 Compare September 3, 2026 12:25
@RSS1102 RSS1102 changed the title fix(Select): 修复 filterable 下中文输入法筛选选中后再次输入会残留上次筛选内容的问题 fix(Select): 修复 filterable 选择后的输入残留和面板闪动问题 Sep 3, 2026
@RSS1102 RSS1102 removed the WIP work in porgess label Sep 3, 2026
@RSS1102 RSS1102 changed the title fix(Select): 修复 filterable 选择后的输入残留和面板闪动问题 fix(Select): fix stale input and option flicker in filterable mode Sep 3, 2026
@uyarn
uyarn merged commit 445a133 into develop Sep 4, 2026
1 check passed
@uyarn
uyarn deleted the fix/select-filterable-composing-input branch September 4, 2026 06:42
@tdesign-bot tdesign-bot mentioned this pull request Sep 4, 2026
16 tasks
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.

4 participants