antd upload组件图片回显失败的解决方法

1,479 阅读1分钟

在使用upload组件上传图片后

image.png

图片列表fileList中的数据格式是这样的

image.png

当你想实现数据回显时从接口返回的图片列表是一个url,并没有type这个属性,所以当你setFileList的时候就会发现图片未显示

setFileList(images.url)

image.png

只要改成和fileList中一样的数据格式就好了,如下

const fileList=images.url.map(url=>{
   return {
   type:"image/png",
   url:url
   }
})
setFileList(fileList)

这样就可以正常显示啦

image.png