ReactJS 循环图像源

Question

我有一个图像链接数组。如果我在src里面循环它，我只会得到第一张图像。我尝试过map()和for loop.它们都只显示第一张图像。

for (let i = 0; i < screenshotList.length; i++) {
return (
<>
<img
src={screenshotList[i]}
width={60}
height={60}
style={{ marginTop: 10, marginLeft: 10 }}
/>
</>
)
}

我也尝试过地图功能

screenshotList.map(value=>{
console.log(value)
return <img src={value} />
})

这也仅显示第一个图像。如何解决？

Answer 1

在循环中使用 returnfor将返回函数。

试试这个。

let imageList = screenshotList.map((value, index)=>{
console.log(value)
return <img src={value} key={index} />
})

在渲染或函数组件返回中使用imageList

例如：<div> {imageList} </div>