Object 可能是“未定義” Reactjs

Question

這個問題解決方案已經在stackoverflow中可用，但是我仍然很困惑，我仍然使用與他們回答相同的方法 go 這個錯誤請幫助我擺脫這個錯誤謝謝我的 object 列表是

 const typeValue = [
        {name: "Subscription", value: "subscription", rank: 2},
        {name: "Single", value: "single", rank: 3},
        {name: "Trial", value: "trial", rank: 0},
        {name: "Unlimited", value: "unlimited", rank: 1000},
        {name: "Promo", value: "promo", rank: 1},
        {name: "Test", value: "test", rank: 0},
        {name: "Brand", value: "brand", rank: 3}
    ]

任何我想找到排名號碼

  rank: typeValue.find(x => x.value === snapshot.data().type).rank    

Answer 1

如果找不到匹配項find將返回undefined ，然后調用.rank是非法的。 要解決，請改用?.rank ：

rank: typeValue.find(x => x.value === snapshot.data().type)?.rank

如果問題仍然存在，那么您可能必須對.type執行相同的操作：

rank: typeValue.find(x => x.value === snapshot.data()?.type)?.rank

Answer 2

typeValue.find(x => x.value === snapshot.data().type)

您試圖在typeValue中找到一個滿足x.value === snapshot.data().type的元素，但snapshot.data().type可以是任何東西，所以 TypeScript 警告typeValue.find(x => x.value === snapshot.data().type)可能會返回undefined 。

如果你想告訴 TypeScript x.value === snapshot.data().type肯定會匹配其中一個元素，你可以使用! ：

rank: typeValue.find(x => x.value === snapshot.data().type)!.rank

你也可以用? 如果rank可以undefined ：

rank: typeValue.find(x => x.value === snapshot.data().type)?.rank

Answer 3

為您聲明typeValue數組變量的類型：-

const typeValue: { name: string; value: string; rank: number }[] = [
  { name: "Subscription", value: "subscription", rank: 2 },
  { name: "Single", value: "single", rank: 3 },
  { name: "Trial", value: "trial", rank: 0 },
  { name: "Unlimited", value: "unlimited", rank: 1000 },
  { name: "Promo", value: "promo", rank: 1 },
  { name: "Test", value: "test", rank: 0 },
  { name: "Brand", value: "brand", rank: 3 },
];

如果您還沒有聲明它，還可以為snapshot.data().type添加類型！