Upload upload limit number, the last one will always show uploading

[ljh257110]

• I have searched the issues of this repository and believe that this is not a duplicate.

Version

3.1.0-rc.2

Environment

"vue": "3.2.20"

Reproduction link

https://next.antdv.com/components/upload-cn

Steps to reproduce

官方网站https://next.antdv.com/components/upload-cn 的照片墙示例就有同样问题

<template>
<div class="clearfix">
<a-upload
v-model:file-list="fileList"
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
list-type="picture-card"
@preview="handlePreview"
>
<div v-if="fileList.length < 8">
<plus-outlined />
<div style="margin-top: 8px">Upload</div>
</div>
</a-upload>
<a-modal :visible="previewVisible" :title="previewTitle" :footer="null" @cancel="handleCancel">
<img alt="example" style="width: 100%" :src="previewImage" />
</a-modal>
</div>
</template>
<script>
import { PlusOutlined } from '@ant-design/icons-vue';
import { defineComponent, ref } from 'vue';

function getBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);

reader.onload = () => resolve(reader.result);

reader.onerror = error => reject(error);
});
}

export default defineComponent({
components: {
PlusOutlined,
},

setup() {
const previewVisible = ref(false);
const previewImage = ref('');
const previewTitle = ref('');
const fileList = ref([{
uid: '-1',
name: 'image.png',
status: 'done',
url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
}, {
uid: '-2',
name: 'image.png',
status: 'done',
url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
}, {
uid: '-3',
name: 'image.png',
status: 'done',
url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
}, {
uid: '-4',
name: 'image.png',
status: 'done',
url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
}, {
uid: '-xxx',
percent: 50,
name: 'image.png',
status: 'uploading',
url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
}, {
uid: '-5',
name: 'image.png',
status: 'error',
}]);

const handleCancel = () => {
previewVisible.value = false;
previewTitle.value = '';
};

const handlePreview = async file => {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}

previewImage.value = file.url || file.preview;
previewVisible.value = true;
previewTitle.value = file.name || file.url.substring(file.url.lastIndexOf('/')   1);
};

return {
previewVisible,
previewImage,
fileList,
handleCancel,
handlePreview,
previewTitle,
};
},

});
</script>
<style>
/* you can make up upload button and sample style by using stylesheets */
.ant-upload-select-picture-card i {
font-size: 32px;
color: #999;
}

.ant-upload-select-picture-card .ant-upload-text {
margin-top: 8px;
color: #666;
}
</style>

What is expected?

当上传照片数到达限制后，上传按钮消失，显示已上传的所有图片

What is actually happening?

上传按钮消失了，但最后一张图片显示上传中

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.