如何從 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>
    ...