标签：status info Vue 方法 fileList Ant Design 上传 change

　　最近项目在使用ant design vue 的时候，使用了a-upload 上传图片。 但是遇到了不少问题，在此总结一下。

　　问题1. 上传图片后，鼠标悬浮或出现代码错误提示 “405 Not Allowed”

　　处理方法： 查了一下，参考了这篇文章 https://blog.csdn.net/Y_G_G/article/details/108105884。结合本地的代码看了一下，将原来的change事件上传修改为了使用 customRequest 自定义事件。问题得以解决。

　　不过，处理完之后也确实遇见了文件状态一直处于uploading 的问题。这里我将上传方法单独抽取了出来，所以执行上传，在axios能正常返回存储路径后，则修改文件状态

//修改status
options.onSuccess(res, options.file)

这样能暂时处理掉一直显示uploading状态的问题。

　　问题2：点击上传图片后无反应 。修改前代码：

//默认change方法 
handleChange (info) {
      if(info.file.status == "done"){
        this.fileList = info.fileList;
      }
    }

a-upload上使用了customRequest 自定义方法，同样也绑定了change方法，因为调用完customRequest方法，会继续调用change方法，所以打算执行完customRequest上传后，通过change方法对fileList进行赋值，回显刚上传的图片。

　　　处理：  检查后发现，之前在change方法中对status进行了判断，在执行上传时(使用axios)文件的状态一直是uploading。在axios未返回结果之前，就调用了change方法，但是change方法中判断只有status为done时，才会进行fileList的赋值,实际的操作中回发现，这样即使是在最后status为done时，也不会再进入到handleChange这个方法。

　　　　　　　　这个时候就需要用到上面说的，对文件上传转态进行修改。在路径返回后，在change方法中不有需要再对status进行判断，直接fileList赋值就可以了。

handleChange(info){
  this.fileList = info.fileList;  
}

标签：status,info,Vue,方法,fileList,Ant,Design,上传,change
来源： https://www.cnblogs.com/Jaden18/p/15100870.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。