我正在使用 axios 通過 API 檢索資料,但我面臨將一個包含標簽的陣列渲染為標簽元素的問題:
這是JSON
{id: 1, header: "Header 1", title: "Title 1", description: "Description 1",…}
card_image: "http://localhost:8000/media/media/images/cards/card1_cMPijRQ.jpg"
description: "Description 1"
header: "Header 1"
id: 1
logo_image: "http://localhost:8000/media/media/images/logos/1_g2pBgUP.png"
main_img: "http://localhost:8000/media/media/images/main/1_sS1Yf60.jpg"
tags: ["Finance", "E-commerce"]
title: "Title 1"
我無法顯示標簽,實際上它顯示一次,然后當我重繪 時顯示此錯誤:
TypeError: Cannot read properties of undefined (reading 'map')
ProductInfo
C:/personalworkspace/BP/front/src/components/ProductInfo.js:39
36 | </div>
37 | </Grid>
38 | <Grid item>
> 39 | <div className="product tags flex container child">
| ^ 40 | {props.tags.map((tagsList, i) => (
41 | <Label size="tiny" as="a" image key={i}>
42 | {tagsList}
請注意,標簽是一個語意 ui 標簽。謝謝你的幫助。
uj5u.com熱心網友回復:
當您呼叫遠程 API 時,當請求正在作業時,標簽未完成,因此未定義。你可以使用這樣的東西:
{(props.tags || []).map((tagsList, i)
或者您可以使用加載器在請求未決時顯示微調器。
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/368347.html
標籤:反应
上一篇:將資料從json存盤到localStorage瀏覽器
下一篇:本地存盤未在Next.js中定義
