如何从 API 调用后台动态图像？

Question

I am trying to call an Image dynamically from thesportsdb API.

After destructuring, I am trying to set the image in the background of this div. But It doesn't show the image. It only works when I add a static image in CSS. It's a react practice project and everything else is working fine.

How may I solve this?

<div style={{background: strStadiumThumb}} className="banner-img">
    <img className='img-fluid' src={strTeamBadge} alt="" />
 </div>

Answer 1

Firstly, please add the relevant code directly into the question, not pictures of code. Secondly, background isn't a valid div tag attribute. If you want to inline the background style, you can use the style attribute, which is an object property that lets you inline CSS styles into your element:

<div style={{ backgroundImage: `url(${strStadiumThumb})` }} className="banner-img>
    ...