feat(Upload): support drag sorting #1931
Open
+512
−2
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Reuse5653
requested review from
anlyyao,
liweijie0812 and
novlan1
as code owners
Reuse5653
changed the title
Reuse5653
changed the title
commit: |
|
|
Reuse5653
changed the title
1 task
Reuse5653
force-pushed
the
feat/upload-draggable
branch
from
dcdb630 to
f32c745
Compare
2 tasks
2025-07-19.21.44.17.mov
|
Reuse5653
force-pushed
the
feat/upload-draggable
branch
from
f32c745 to
b2ba74e
Compare
|
好的，已修改 |
@Reuse5653 缺少滑动的效果～ |
Wesley-0808
reviewed
Aug 6, 2025
| * @param itemClassName - 单个可拖拽项的类名。 | ||
| * @returns 返回一个包含拖拽事件处理器和状态的对象。 | ||
| */ | ||
| export function useDrag( |
There was a problem hiding this comment.
这里的props和emit入参都能去掉，后面通过getCurrentInstance获取即可
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
🤔 这个 PR 的性质是？
🔗 相关 Issue
close #1903
💡 需求背景和解决方案
1. 需求背景
当前
Upload组件不支持对已上传的图片进行拖拽排序，在需要调整图片顺序的场景下，用户只能删除后重新上传，体验不佳。2. 解决方案
为
Upload组件新增draggable属性，并基于 HTML5 Drag & Drop API 实现拖拽排序功能。主要实现如下：draggable: boolean属性，用于开启或关闭拖拽功能。useDrag.tsHook 中，利用 HTML5 的drag & dropAPI 监听dragstart,dragover,dragend等事件，并在dragover事件中实时更新v-model的数组顺序。3. UI/交互效果演示
📝 更新日志
draggable属性，用于支持对上传列表进行拖拽排序。🚀 相关 PR
☑️ 请求合并前的自查清单