fix(select):[select] fix the focus event is triggered and prevent the panel from failing to collapse #2876
Conversation
…onent is set to true, the focus event is not triggered actively to prevent the panel from failing to collapse
WalkthroughThis pull request modifies the renderless select component. In index.ts, the setSoftFocus function is updated to include a new "props" parameter and now checks the "automaticDropdown" property before focusing the input. In vue.ts, the setSoftFocus update is incorporated into the API, and several new computed properties and methods have been added to handle user interactions, such as clearing search text and managing debounced query changes, thereby refining state management and input response behavior. Changes
Sequence Diagram(s)sequenceDiagram
participant Caller
participant setSoftFocus
participant InputElement
Caller->>setSoftFocus: Call with { vm, state, props }
alt props.automaticDropdown is false
setSoftFocus->>InputElement: focus input
else props.automaticDropdown is true
setSoftFocus-->>Caller: Skip focus
end
setSoftFocus->>Caller: Set softFocus to false
sequenceDiagram
participant User
participant InputField
participant Component
participant DebounceHandler
User->>InputField: Enter search text
InputField->>Component: Emit query change event
Component->>DebounceHandler: handleDebouncedQueryChange(query)
DebounceHandler->>Component: Update state & computed properties
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (2)
⏰ Context from checks skipped due to timeout of 90000ms (1)
🔇 Additional comments (2)
✨ Finishing Touches
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
Walkthrough此PR修复了当 Changes
|
![petercat-assistant[bot]](https://avatars.githubusercontent.com/in/875736?s=60&v=4){kind=small}
| if (input) { | ||
| input.focus() | ||
| // tiny 新增： 解决获焦即弹出时，关闭不了下拉面板，所以增加了!props.automaticDropdown条件 | ||
| if (!props.automaticDropdown) { |
There was a problem hiding this comment.
确保props.automaticDropdown的正确性和完整性，以避免潜在的逻辑错误。
WalkthroughThis PR fixes an issue where the Changes
|
PR
修复select组件在automatic-dropdown属性为true时， focus事件会阻止下拉面板收起的问题
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
What is the current behavior?
Issue Number: N/A
What is the new behavior?
Does this PR introduce a breaking change?
Other information
Summary by CodeRabbit
New Features
Bug Fixes