json - 将反应上下文作为 JSON，但不能真正访问它的部分

Question

我通过 useContext 从反应组件获取上下文：

const [getDrinksData, setDrinksData] = useContext(DrinksContext)

并且可以访问例如 getDrinksData.length：193 或

JSON.stringify(getDrinksData)： [{"country":"Afghanistan","beer_servings":"0","spirit_servings":"0","wine_servings":"0","total_litres_of_pure_alcohol":"0.0"},{"country":"Albania","beer_servings":"89","spirit_servings":"132","wine_servings":"54","total_litres_of_pure_alcohol":"4.9"},{"country":"Algeria","beer_servings":"25","spirit_servings":"0","wine_servings":"14","total_litres_of_pure_alcohol":"0.7"},{"country":"Andorra","beer_servings":"245","spirit_servings":"138","wine_servings":"312","total_litres_of_pure_alcohol":"12.4"}, ...

甚至

JSON.stringify(getDrinksData[0])：

{"country":"Afghanistan","beer_servings":"0","spirit_servings":"0","wine_servings":"0","total_litres_of_pure_alcohol":"0.0"}

但如果我尝试访问

getDrinksData[0].country

我收到未定义 getDrinksData[0] 的错误。

如果我使用

getDrinksData.map((drinks,index) => (<p key={index}>{drinks.country} {drinks.beer_servings} {drinks.spirit_servings} {drinks.wine_servings} {drinks.total_litres_of_pure_alcohol}</p>))

有用。有人可以解释一下或帮助我吗？

提前谢谢了！

亲切的问候

托马斯

标签： jsonreactjsreact-context