deep-jade
deep-jade2y ago

Preview Image on edit page load

Hi ! how do in ensure that when I go to my edit page, it shows image on my Upload component ? When I upload a file it does show it, but I also want to show it when I first load it, currently, its just showing me the blue icon css -> antd upload multipart form
No description
5 Replies
refine-support-bot
Hey, I am refine support bot :wave:. I am here to help you with your question. I searched for the answer to your question in the refine documentation and could not find an answer. Please wait for someone from the refine core team or the community to try to help you. 👊
rare-sapphire
rare-sapphire2y ago
deep-jade
deep-jadeOP2y ago
thank you, I will give it a shot if everything works will close this issue
rare-sapphire
rare-sapphire2y ago
it can also remain for reference to others. it doesn't matter. your choice 👍
deep-jade
deep-jadeOP2y ago
sure, I will then keep it just to add more context to this, I was uploading image with content-type: multipart/formdata, so firstly for my Create view, I was getting undefined for my coverImage Form.Item field, but once I changed the Form.Item name from camel case to all lowercaps coverimage I was able to retrieve it my custom handleOnfinish function for the Create view Now going back to this question of the thread, with AntdD Upload component, on EDIT page I was unable make my already present image File list, show image in the thumbnail of the Upload file list, everything was working fine, but just as shown in the picture in the question, it wasn't rendering the image. I figured out that the way to resolve this was to set the Upload isImageUrl prop
isImageUrl={file => file?.url}
isImageUrl={file => file?.url}
Hope, this helps whoever stumbles across it

Did you find this page helpful?