How to load a image path through props in react

Question

how to load imported image path to img tag src from the component props. please help

import amy from "./amy.jpg";
<AvatarProfileIcon icon="amy" />

 <img src={props.icon} />

https://codesandbox.io/s/load-icon-through-props-in-img-src-9qzox5

Answer 1

Try wrapping your imported image inside curly braces {} instead of double quotes "" since they are being used for strings.

import amy from "./amy.jpg";

export default function App() {
  return (
    <div className="App">
      <AvatarProfileIcon icon={amy} />
    </div>
  );
}

Live Demo