fix(web): improve file removal confirmation flow in UploadFiles

- Move custom onRemove callback execution into confirmation dialog's onOk handler
- Add async/await support for Promise-based onRemove callbacks
- Display confirmation dialog before executing removal logic to prevent accidental deletions
- Ensure file is only removed after user confirms and custom callback completes
- Improve UX by confirming user intent before triggering removal callbacks
This commit is contained in:
yujiangping
2026-01-22 20:58:49 +08:00
parent 5dcc815240
commit d56e168df9

View File

@@ -89,21 +89,25 @@ const UploadFiles = forwardRef<UploadFilesRef, UploadFilesProps>(({
// 处理文件移除
const handleRemove = (file: UploadFile) => {
// 如果有自定义的 onRemove 回调,先执行它
if (customOnRemove) {
const result = customOnRemove(file);
// 如果返回 false阻止移除
if (result === false) {
return false;
}
}
// 显示确认弹窗
confirm({
title: `${t('common.confirmRemoveFile')}`,
okText: `${t('common.confirm')}`,
okType: 'danger',
cancelText: `${t('common.cancel')}`,
onOk: () => {
onOk: async () => {
// 如果有自定义的 onRemove 回调,在确认后执行
if (customOnRemove) {
const result = customOnRemove(file);
// 等待 Promise 结果
const finalResult = result instanceof Promise ? await result : result;
// 如果返回 false阻止移除
if (finalResult === false) {
return;
}
}
// 移除文件
const newFileList = fileList.filter((item) => item.uid !== file.uid);
setFileList(newFileList);
onChange?.(newFileList);