代码地址如下:
https://github.com/GavinZhuLei/vue-form-making/blob/master/src/components/Upload/index.vue#L204
部分代码如下:
xhr.onreadystatechange = () => {
console.log(xhr)
if (xhr.readyState === 4) {
let resData = JSON.parse(xhr.response)
if (resData && resData.url) {
this.$set(this.fileList, this.fileList.findIndex(item => item.key === key), {
...this.fileList[this.fileList.findIndex(item => item.key === key)],
url: resData.url,
percent: 100,
status: 'success', // 这里是我加的,直接写在这里不行吗?
})
this.$emit('input', this.fileList) // 这里是我加的,直接写在这里不行吗?
// 这里为啥要 setTimeout ?
setTimeout(() => {
this.$set(this.fileList, this.fileList.findIndex(item => item.key === key), {
...this.fileList[this.fileList.findIndex(item => item.key === key)],
status: 'success'
})
this.$emit('input', this.fileList)
}, 200)
} else {
this.$set(this.fileList, this.fileList.findIndex(item => item.key === key), {
...this.fileList[this.fileList.findIndex(item => item.key === key)],
status: 'error'
})
this.fileList.splice(this.fileList.findIndex(item => item.key === key), 1)
}
}
}
1
hsfzxjy 2022-03-28 16:00:28 +08:00 via Android
感觉是想让进度条在 100 停一会再显示 success
|
2
cxe2v 2022-03-28 16:06:32 +08:00
赞同一楼,可能是为了让页面有个过渡效果不至于显示突兀
|
3
nomagick 2022-03-28 16:09:13 +08:00
我的天我眼晕,读这个代码真得需要写轮眼
|
4
gadfly3173 2022-03-28 18:27:15 +08:00
这个 this.fileList 用了这么多次,可以考虑 const 成一个局部变量,好读还能提高性能。。。
|
5
wunonglin 2022-03-28 18:30:21 +08:00
这么写,但凡有个空,整个报错 😅
|
6
ruoxie 2022-03-28 18:47:43 +08:00
fileList.findIndex(item => item.key === key),这个 fileList 被轮了好多次
|
7
ruoxie 2022-03-28 18:52:49 +08:00
这个项目 4.6k Star ,我惊了
|