在删除文件后,再次上传同一个文件时会出现问题。这是因为在删除文件后,虽然从fileList中删除了相应的文件记录,但由于input元素的特性,它不会自动清除已选择的文件。因此,当再次选择相同的文件时,onChange方法不会被触发,导致文件上传失败。
要解决这个问题,可以在handleRemove方法中手动清除input元素的值,以确保下次选择相同文件时会触发onChange方法。可以使用以下代码来清除input元素的值:
handleRemove(file) {
// 这里是父子通信,没有使用emit,而是用数组方法来保持响应式
this.fileList.splice(this.fileList.findIndex(x => x.url === file.url), 1)
// 清除input元素的值
this.$refs.import.value = ''
}
通过将this.$refs.import.value设置为空字符串,可以清除input元素的值,这样下次选择相同文件时,onChange方法就会被触发,从而解决上传失败的问题。