How to import image into React from public folder through a json file-CodePudding

As the title says I have multiple images and I want to keep them in a json where it stores the url and from there I want to get image data accordingly.

Here is my codesandbox, I am not sure why it is not showing any images after going through a bunch of answers here. https://codesandbox.io/s/confident-galois-2pn52

CodePudding user response：

You should use the JSON like

 <img src={`${data.images.url}`} alt={data.images.name} />

Please update your code. It will start showing the images.

Your JSON structure has images object in it which you are not consuming.

CodePudding user response：

Seems like you forget one level

images

in JSON. Code of IMG in component should looks like this:

<img src={data.images.url} alt={data.images.name} />