CODEWITHSUNDEEP
reactjs
Whymess
Whymess

Reputation: 717

Render image from props in react,

I want to receive an image from props. In props, it contains the path of the URL.

For some reason, this does not work.

render(){
 const imageURL = require(`${this.props.photo}`)
return (
    <div className="profile">
        <img alt="mug shot" src={imageURL} />

but this works....

render(){

return (
    <div className="profile">
        <img alt="mug shot" src={require('../../Assets/Photos/Four.png')} />

The app was configured using Create-React-App.

Upvotes: 0

Views: 1055

Answers (1)

Gilad Artzi
Gilad Artzi

Reputation: 3084

Please notice that webpack cannot handle dynamic require statements like require(`${this.props.photo}`). It can only handle static require statements, as webpack runs in "build time" - it cannot resolve any variables.

Upvotes: 1

Related Questions