我在嘗試映射資料時遇到問題。我想要在產品供應商中達到公司名稱。我該如何解決?
{products.map((repo) => (
<div
style={{
backgroundColor: "#c1d3d4",
marginTop: 50,
display: "flex",
flexDirection: "column",
minWidth: 1000,
paddingLeft: 50,
marginLeft: 400,
paddingRight: 30,
paddingBottom: 12,
borderRadius: 15,
}}
span={24}
>
<p style={{ flex: 1, fontWeight: "bold", fontSize: 26 }}>
{repo.name}
</p>
<p style={{ fontWeight: "bold", fontSize: 14 }}>{repo.supplier.companyName}</p>
<p style={{ fontWeight: "bold", fontSize: 14 }}>
{repo.quantityPerUnit}
</p>
<div
style={{
display: "flex",
flexDirection: "row",
justifyContent: "space-between",
alignContent: "flex-end",
}}
>
<p
style={{
fontSize: 20,
fontWeight: "800",
color: "green",
alignSelf: "flex-end",
}}
>
{repo.unitPrice.toFixed(2)}
</p>
<Button type="primary" onClick={() => AddCart(repo)}>
Sepete Ekle
</Button>
</div>
</div>
))}
這是錯誤資訊 錯誤
這是資料:
https://northwind.vercel.app/api/products
編輯:
@Tim Roberts 找到了解決方案。只有一些元素有供應商,而其他元素沒有。當我嘗試使用地圖時,我收到了錯誤訊息。我現在知道了。
uj5u.com熱心網友回復:
我認為發生錯誤是因為在來自 api 的某些資料中,供應商道具不存在。
您的代碼 "<p style={{ fontWeight: "bold", fontSize: 14 }}>{repo.supplier.companyName}
"可能的解決方案
"<p style={{ fontWeight: "bold", fontSize: 14 }}>{repo.supplier && repo.supplier.companyName}
"轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/460661.html
標籤:javascript 数组 反应
上一篇:如何修復不起作用的重啟按鈕
