React-starter-kit: backgroundImage in inline style

Created on 19 Nov 2016 · 1Comment · Source: kriasoft/react-starter-kit

I need to specify dynamic background image for div.
So it looks like this.
"

url(../../public/${imgName})}} />"
But when I run it with npm start, it converted into absolute url - http://localhost:3000/public/test.png, and it can't load the image.
Is there anyway I can solve this issue?

Source

phoenix377

Most helpful comment

function bgImage(props) {
  const imageUrl = require(`./images/${props.imageName}.jpg`)
  return <div style={{ backgroundImage: `url(${imageUrl})` }} />
}

frenzzy on 19 Nov 2016

👍25 ❤4 🎉2 🚀1

>All comments

function bgImage(props) {
  const imageUrl = require(`./images/${props.imageName}.jpg`)
  return <div style={{ backgroundImage: `url(${imageUrl})` }} />
}

frenzzy on 19 Nov 2016

👍25 ❤4 🎉2 🚀1

Was this page helpful?

0 / 5 - 0 ratings