How To have Dynamic image src in React App-CodePudding

In a react App, I would like to store the image path or at least the name of the image file in DB. The image source would be dynamically added.

The below code works:

<img src={require("../Images/amazon.jpg")}></img>

The below code does not work (error:Cannot find module '../Images/amazon.jpg'):

const path = `../Images/amazon.jpg`;
<img src={require( `${path}`)}></img>

How can we set the img src dynamically after fetching image path/name from database.

CodePudding user response：

If you have a public folder for assets, then you can try:

<img src={`../Images/amazon.jpg`}></img>

CodePudding user response：

The best way is to just load your images from the URL.

<img src={url}></img>