0

There seems to be a problem with the function Card(props).

The output is fine if I replace the function's content with <img src="data[0].img" instead of props.img, etc.

var data =
    [{
        id: 1,
        name: "tokyo",
        descr: "a",
        img: "/tokyo.png"
    }
    ]

function Card(props) {
    return (
       <div>
            <img src={props.img}/>
            <h1> {props.name}</h1>
            <p> {props.descr}</p>
        </div>
        )
}

const cards = data.map(item => {
    return (<Card
        img={item.img}
        name={item.name}
        descr={item.descr}
        key={item.id} />)
})



ReactDOM.render({cards},document.getElementById("root"))
isherwood
  • 58,414
  • 16
  • 114
  • 157
Earl Grey
  • 1
  • 1
  • 1
    Seems to works [fine](https://stackblitz.com/edit/react-fn9jxz?file=src%2Findex.js) with an external image, what's your error? – 18jad Nov 15 '22 at 20:24
  • Does this answer your question? [Image not loading when passing a prop to in React](https://stackoverflow.com/questions/60961230/image-not-loading-when-passing-a-prop-to-img-src-this-prop-in-react) – isherwood Nov 15 '22 at 20:25
  • I tried to run the code. It is working perfect. – Harshit Sharma Nov 15 '22 at 20:31
  • That's peculiar.. My webpage is really just blank when I run the code – Earl Grey Nov 15 '22 at 21:00

0 Answers0