Javascript 如何在React中显示API调用中的复杂对象属性

所以我一直在做一个关于react的食谱应用程序。我已从此网站获取此应用程序的数据。我可以通过搜索显示膳食名称，如果我想了解膳食的具体细节，我也可以这样做，但在这个API中有一个复杂的数据块，显示所有成分和测量值。我试了很长时间，但无法显示餐点的尺寸和成分。我附上的成分和测量响应

---

正如您所看到的，在成分和度量值中都有空值。如果我按ex-strIngredient1、strIngredient2等的号码调用它们，我可以显示这两个。我要做的是，我将采取所有的成分和措施，每当有一个空字符串或空字符串，它不会显示在一个具体的膳食细节。如何使用React钩子实现它？

这与React没有任何关系

您可以使用以下方法在JS中测试truthy（解析为true的内容）：

if（x）{}

---

空字符串不会进入该字段，也不会进入

undefined

或

null

。只需检查每个值，看看是否应该将其添加到UI中，就可以了。

请以文本形式发布一个小样本数据，供人们使用。具体的反应是，这通常是通过JSX中的表达式完成的，即三值运算或短路运算。这就是JS。JSX中的所有脚本都是可用的。这一切归结为一个真实的检查。有用的“表格”，以防万一：。也值得查看“请参阅”部分中的链接。