Ant Design of Vue 上传文件状态一直为uploading

问题描述

多文件上传 ,上传成功但是前端组件没有回显。查看change时间,file状态一直是uploading,正常状态应该是done

原因:

onchange 只触发了一次,单文件上传@change时间会触发两次,第一次file.status = uploading,最后一次为done或者error。但是如果是需要上传显示一组文件,则需要保存文件的状态会给一个属性file-list="fileList"这时候change事件只会触发一次(uploading)。

解决:

对于受控模式,你应该在 onChange 中始终随时跟踪fileList的状态,保证所有状态同步到Upload内。

andleChangeFile (info, code) { //上传文件
      console.log('info===>', info, code, info.fileList);
      let { fileList } = info
      const status = info.file.status
      if (status !== 'uploading') {
      }
      if (status === 'done') {
        this.videoUrlList.push({ uid: fileList[fileList.length - 1].uid, url: info.file.response.data.url })
      }
      this.fileList = [...fileList] //重点
    },

最后一行是关键,无论file上传状态如何filelist一定要同步,还有不能用return,要不然就没有回调了

感谢:https://blog.csdn.net/zhhao1/article/details/107106890
https://segmentfault.com/a/1190000038666283?utm_source=tag-newest

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容