el-upload多文件上传，上传成功后依然要显示进度条在下面

你可以使用 `el-progress` 组件来实现上传进度条的显示。可以在 `http-request` 事件中监听上传进度，并将进度值传递给 `el-progress` 组件即可。 下面是一个示例代码： ```html <template> <el-upload class="upload-demo" action="/upload" :on-preview="handlePreview" :on-remove="handleRemove" :on-success="handleSuccess" :http-request="handleUpload" :file-list="fileList"> <el-button size="small" type="primary">点击上传</el-button> <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div> </el-upload> <el-progress :stroke-width="10" :percentage="uploadProgress" :status="uploadStatus"></el-progress> </template> <script> export default { data() { return { fileList: [], uploadProgress: 0, uploadStatus: '', }; }, methods: { handleUpload(file) { const xhr = new XMLHttpRequest(); const formData = new FormData(); formData.append('file', file); xhr.upload.addEventListener('progress', (event) => { if (event.lengthComputable) { this.uploadProgress = Math.round((event.loaded * 100) / event.total); } }); xhr.addEventListener('load', () => { this.uploadStatus = 'success'; }); xhr.addEventListener('error', () => { this.uploadStatus = 'fail'; }); xhr.open('POST', '/upload'); xhr.send(formData); }, handleSuccess(response, file) { this.$message.success('上传成功'); this.fileList.push(file); }, handleRemove(file, fileList) { console.log(file, fileList); }, handlePreview(file) { console.log(file); }, }, }; </script> ``` 在上述示例代码中，使用了 `el-progress` 组件来显示上传进度条，`uploadProgress` 是进度条的数值，`uploadStatus` 是进度条的状态。在 `handleUpload` 方法中，监听了 `XMLHttpRequest` 的 `progress` 事件，并将进度值传递给 `uploadProgress`。在 `handleSuccess` 方法中，将上传成功的文件添加到 `fileList` 中。