如何将Javascript变量集成到ReactJS JSX样式元素中

我有一个javascript图像源数组。现在我需要在单独的框背景中实现每个图像源。我试图将数组元素放入React JSX样式的元素中，如下所示（演示代码）

const-box=[]
for（images.entries（）的常量[索引，图像]）{
推箱子(
这里有一些代码。。。。。。。
)}
返回（{box}）

---

希望我能让你明白我的问题。请帮助，任何其他方式都是受欢迎的。提前感谢

，因为

循环不会直接在

渲染

功能中工作。您可以改用

map

images.map((image, index) => (
  <Box key={index} style={{background: `url(${image})`}}>
       Some code goes here.......
  </Box>
))

images.map（（图像，索引）=>(
这里有一些代码。。。。。。。
))

检查此示例：

您也可以检查以下内容：

---

希望这有帮助

使用类似于：

constimagebox=images.map（（图像，索引）=>）

。然后可以将

{imagebox}

渲染到主渲染中，或者直接在主渲染中执行

.map

。@JamieDixon感谢您的回答，但我的问题是如何将javascript变量集成到React JSX样式元素中。就像在“style={{background:'url（image）}}}”中一样，感谢您的回答，但我的问题是如何将javascript变量集成到React JSX样式元素中。就像在“style={{background:'url（image）}}”中一样。让我编辑代码，它正在创建混乱。我已经更新了示例。您可以使用模板文字来定义变量。下面是阅读更多内容的链接：我还添加了一个具有相同用例的示例。希望这会有所帮助。