Skip to content

Conversation

@SonyLeo
Copy link
Collaborator

@SonyLeo SonyLeo commented Jan 6, 2026

修复 Sender 组件解构上传对象参数丢失响应式

关联 issue -> #281

Summary by CodeRabbit

  • New Features
    • File dialog accept, multiple, and reset options now dynamically respond to configuration changes at runtime rather than remaining static
    • Added 'files-selected' event that emits whenever users select files through the dialog, providing the selected files array and allowing applications to react to selections

✏️ Tip: You can customize this high-level summary in your review settings.

@coderabbitai
Copy link

coderabbitai bot commented Jan 6, 2026

Walkthrough

Modified the file dialog component to use reactive references for configuration options (accept, multiple, reset) via toRef, enabling runtime property changes. Added a new "files-selected" event that emits the selected files array when users interact with the dialog.

Changes

Cohort / File(s) Summary
File Dialog Reactivity
packages/components/src/sender/index.vue
Added toRef import from Vue; wrapped dialog configuration options (accept, multiple, reset) with toRef to make them reactive instead of static. This allows the dialog to respond to prop changes at runtime.
New Event Emission
packages/components/src/sender/index.vue
Introduced new public event files-selected with Array<File> payload to the component's SenderEmits. Event fires when users select files from the dialog, expanding the public API surface.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Poem

🐰 A dialog so reactive, now dancing with props,
Each file that you choose, the event never stops,
No more frozen settings, just change as you please,
The files flow freely, responsive with ease!

Pre-merge checks

✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately describes the main change: making file dialog options reactive using refs, which directly addresses the primary fix for maintaining reactivity when destructuring parameters.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@github-actions
Copy link
Contributor

github-actions bot commented Jan 6, 2026

✅ Preview build completed successfully!

Click the image above to preview.
Preview will be automatically removed when this PR is closed.

@github-actions
Copy link
Contributor

github-actions bot commented Jan 6, 2026

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🤖 Fix all issues with AI Agents
In @packages/components/src/sender/index.vue:
- Around line 482-486: The options passed to useFileDialog are primitives but
the code passes Refs via toRef, which is incompatible; change the initialization
to pass primitive values (e.g., use toValue or read the .value of the refs for
accept/multiple/reset) or remove toRef and supply literal values derived from
props.buttonGroup?.file (accept: props.buttonGroup?.file?.accept ?? '*',
multiple: Boolean(...), reset: ...), and if props can change at runtime add a
watcher that calls the useFileDialog open() with updated options when
props.buttonGroup.file changes; locate the call to useFileDialog and replace the
toRef usages accordingly.
📜 Review details

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 67a16b1 and 80e4f4f.

📒 Files selected for processing (1)
  • packages/components/src/sender/index.vue
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
  • GitHub Check: build / build
🔇 Additional comments (2)
packages/components/src/sender/index.vue (2)

2-2: LGTM! Import addition is appropriate.

The toRef import is correctly added to support reactive file dialog options below.


488-492: LGTM! Event emission logic is correct.

The watcher appropriately emits the new files-selected event when files are selected. The use of Array.from() ensures proper array conversion from the FileList object.

@gene9831 gene9831 linked an issue Jan 6, 2026 that may be closed by this pull request
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.

tr-sender的附件上传按钮,accept等属性不是响应式的

2 participants