有朋友可以帮忙解释下这段 Vue 代码为啥要写个 setTimeout 吗？直接写在上面不行吗？

[coolair]

代码地址如下：

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)
      }
    }
  }

[hsfzxjy]

感觉是想让进度条在 100 停一会再显示 success

[cxe2v]

赞同一楼，可能是为了让页面有个过渡效果不至于显示突兀

[nomagick]

我的天我眼晕，读这个代码真得需要写轮眼

[gadfly3173]

这个 this.fileList 用了这么多次，可以考虑 const 成一个局部变量，好读还能提高性能。。。

[wunonglin]

这么写，但凡有个空，整个报错 😅

[ruoxie]

fileList.findIndex(item => item.key === key)，这个 fileList 被轮了好多次

[ruoxie]

这个项目 4.6k Star ，我惊了