使用反應樣式設置背景圖像

Question

我正在制作自己的項目，我正在嘗試顯示 3 個組件，這些組件將為其中一個呈現不同的圖像。 圖像未顯示，我認為問題是服務器正在將圖像下載為 html/文本類型。 我是新來的反應，我在顯示圖像時遇到困難......

style={{backgroundImage: url(${props.img}) } }

img={city.imageURL}

imageURL: '/assets/mount-fugji.png'

順便說一句，我如何訪問樣式 object？

Answer 1

在 React 中你應該使用：

styles={{ backgroundImage:`url(${picture})` }}

所以你可以嘗試像這樣編輯代碼：

style={{backgroundImage: `url(${props.img})`} }

Answer 2

你可以像這樣使用

 <div style={{ backgroundImage: `url(${props.img || city.imageURL})` }} />;