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

Question

我正在尝试从sportsdb API 动态调用图像。

解构后，我试图在这个 div 的背景中设置图像。 但它没有显示图像。 它仅在我在 CSS 中添加 static 图像时才有效。 这是一个反应练习项目，其他一切都很好。

我该如何解决这个问题？

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

Answer 1

首先，请直接将相关代码添加到问题中，而不是代码图片。 其次， background不是有效的div标签属性。 如果要内联背景样式，可以使用style属性，这是一个 object 属性，可让您将 CSS styles 内联到元素中：

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