内联样式背景图像不显示带有变量的 Reactjs 中的本地图像

Question

enter image description here strong text

enter image description here

Can someone tell me what I did wrong with the inline style? when I set the background-image in css file, it display the picture.

Answer 1

Try adding height and width on your style object

const style = {
  backgroundImage: `url(pic_${num}`,
  height: "200px",
  width: "200px"
}

since div has no content consider adding width and height. If it doesn't work please edit your question or show us what is passed in the num variable or maybe show us whats going on the console.

Answer 2

I figured out that the problem is image loading. I sorted it out by moving the images folder to public folder and then all the images loaded smoothly.