Skip to content

Commit 4226e04

Browse files
committed
chore: simplify logic
1 parent f7fe662 commit 4226e04

1 file changed

Lines changed: 11 additions & 30 deletions

File tree

packages/components/upload/hooks/useUpload.ts

Lines changed: 11 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -27,21 +27,14 @@ export default function useUpload(props: TdUploadProps) {
2727
const { disabled, autoUpload, isBatchUpload } = props;
2828
const { classPrefix } = useConfig();
2929
const [globalLocale, t] = useLocaleReceiver('upload');
30+
3031
const [uploadValue, setUploadValue] = useControlled(props, 'files', props.onChange);
32+
3133
const xhrReq = useRef<{ files: UploadFile[]; xhrReq: XMLHttpRequest }[]>([]);
3234
const [toUploadFiles, setToUploadFiles] = useState<UploadFile[]>([]);
3335
const [sizeOverLimitMessage, setSizeOverLimitMessage] = useState('');
3436
const [update, forceUpdate] = useState({});
3537

36-
// 标记 setUploadValue 是否由组件内部主动触发
37-
// - true:内部调用(如选择文件、上传成功、onRemove 等),不需要进行外部清空联动
38-
// - false:外部主动修改 props.files,需要联动清空 toUploadFiles
39-
const internalUpdateRef = useRef(false);
40-
const updateInternalValue: typeof setUploadValue = (value, ...args) => {
41-
internalUpdateRef.current = true;
42-
setUploadValue(value, ...args);
43-
};
44-
4538
const locale = useMemo(() => merge({}, globalLocale, props.locale), [globalLocale, props.locale]);
4639

4740
const tipsClasses = `${classPrefix}-upload__tips ${classPrefix}-size-s`;
@@ -100,7 +93,7 @@ export default function useUpload(props: TdUploadProps) {
10093
if (props.autoUpload) {
10194
setToUploadFiles([...toFiles]);
10295
} else {
103-
updateInternalValue([...uploadValue], {
96+
setUploadValue([...uploadValue], {
10497
e: p.event,
10598
trigger,
10699
index: uploadValue.length,
@@ -158,7 +151,7 @@ export default function useUpload(props: TdUploadProps) {
158151
const handleNotAutoUpload = (toFiles: UploadFile[]) => {
159152
const tmpFiles = props.multiple && !isBatchUpload ? uploadValue.concat(toFiles) : toFiles;
160153
if (!tmpFiles.length) return;
161-
updateInternalValue(tmpFiles, {
154+
setUploadValue(tmpFiles, {
162155
trigger: 'add',
163156
index: uploadValue.length,
164157
file: toFiles[0],
@@ -302,7 +295,7 @@ export default function useUpload(props: TdUploadProps) {
302295
}).then(({ status, data, list, failedFiles }) => {
303296
setUploading(false);
304297
if (status === 'success') {
305-
updateInternalValue([...data.files], {
298+
setUploadValue([...data.files], {
306299
trigger: 'add',
307300
file: data.files[0],
308301
});
@@ -348,16 +341,16 @@ export default function useUpload(props: TdUploadProps) {
348341
// remove all files for batchUpload
349342
if (isBatchUpload || !props.multiple) {
350343
props.onWaitingUploadFilesChange?.({ files: [], trigger: 'remove' });
351-
updateInternalValue([], changePrams);
344+
setUploadValue([], changePrams);
352345
setToUploadFiles([]);
353346
xhrReq.current = [];
354347
} else if (!props.autoUpload) {
355348
const newUploadValue = uploadValue.filter((_, i) => i !== p.index);
356-
updateInternalValue(newUploadValue, changePrams);
349+
setUploadValue(newUploadValue, changePrams);
357350
} else if (p.index < uploadValue.length) {
358351
// autoUpload 场景下, p.index < uploadValue.length 表示移除已经上传成功的文件;反之表示移除待上传列表文件
359352
const newUploadValue = uploadValue.filter((_, i) => i !== p.index);
360-
updateInternalValue(newUploadValue, changePrams);
353+
setUploadValue(newUploadValue, changePrams);
361354
} else {
362355
const tmpFiles = [...toUploadFiles];
363356
tmpFiles.splice(p.index - uploadValue.length, 1);
@@ -383,7 +376,7 @@ export default function useUpload(props: TdUploadProps) {
383376
if (autoUpload) {
384377
setToUploadFiles([]);
385378
} else {
386-
updateInternalValue(
379+
setUploadValue(
387380
uploadValue.map((item) => {
388381
if (item.status !== 'success') {
389382
return { ...item, status: 'waiting' };
@@ -404,21 +397,9 @@ export default function useUpload(props: TdUploadProps) {
404397
// 矫正数据格式为数组
405398
useEffect(() => {
406399
if (!Array.isArray(uploadValue)) {
407-
updateInternalValue([], { trigger: 'default' });
408-
}
409-
// eslint-disable-next-line react-hooks/exhaustive-deps
410-
}, [uploadValue]);
411-
412-
useEffect(() => {
413-
// 监听受控值 props.files 的引用变化:
414-
// - 若变化由组件内部触发(internalUpdateRef === true),消费标记后跳过
415-
// - 若变化由外部主动触发且新值为空数组,则同步清空内部维护的 toUploadFiles,确保失败/等待的文件能被一起清除
416-
if (internalUpdateRef.current) {
417-
internalUpdateRef.current = false;
418-
return;
400+
setUploadValue([], { trigger: 'default' });
419401
}
420-
const currentLen = Array.isArray(uploadValue) ? uploadValue.length : 0;
421-
if (currentLen === 0 && toUploadFiles.length > 0) {
402+
if (Array.isArray(uploadValue) && uploadValue.length === 0 && toUploadFiles.length > 0 && !uploading) {
422403
setToUploadFiles([]);
423404
props.onWaitingUploadFilesChange?.({ files: [], trigger: 'remove' });
424405
}

0 commit comments

Comments
 (0)