我以這種方式從 reddit 獲取圖庫照片的影像 ID：
// Check if post is a gallery and if yes, map through each image and get the id
if (post.is_gallery) {
const id = post.gallery_data.items.map((item) => item.media_id);
console.log(id);
}
我想將這些 ID 中的每一個放在一個<img />元素中并呈現它們，但是我從 if 陳述句中得到的回應是這樣的：
如何從陣列中獲取每個 ID 并將它們呈現在多個<img >元素中？
<img
src={`https://i.redd.it/${id-goes-here}.jpg`}
className="image"
alt="Gallery Images"
/>
uj5u.com熱心網友回復：
你可以映射你的資料并回傳一個img這樣的標簽：
const images = post.gallery_data.items.map((item) => <img src={`https://i.redd.it/${item.media_id}.jpg`}
key={item.media_id}
className="image"
alt="Gallery Images"/>);
然后你可以把你的images變數放在你的 jsx 中，像這樣：
return (<>{images}</>)
你也可以將地圖直接放在你的 jsx 渲染中，像這樣：
return (<>{post.gallery_data.items.map((item) => <img src={`https://i.redd.it/${item.media_id}.jpg`}
key={item.media_id}
className="image"
alt="Gallery Images"/>
}</>);
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/380163.html
標籤：javascript 数组 反应
下一篇：use<endpoint><modifier>和endpoints.<endpoint>.<modifier>之間有區別嗎？