reactjs - 我如何循环遍历对象内部的数组。并在 react 组件中渲染
问题描述
我想循环遍历对象内部的数组并拉取数据以在反应组件中呈现。但我不知道如何使用映射到对象内部的数组。我尝试了很多方法,但它不起作用
const [emailData, setEmailData] = useState("");
res?.data.emails.map((email) =>
setEmailData(
<Table.Row>
<Table.Cell>{email.emailed_to}</Table.Cell>
<Table.Cell>{email.notes}</Table.Cell>
<Table.Cell>{email.created_at}</Table.Cell>
</Table.Row>
);
);
return ({ emailData });
解决方案
您可以使用Object 函数来包装您的对象。
const object1 = {a: 1, b: 2, c: 3}
它有3个版本:
- Keys:
Object.keys(object1)
返回所有键的数组 =>[a,b,c]
- 值:
Object.values(object1)
返回所有值的数组 =>[1,2,3]
- Entries:
Object.entries(object1)
将所有整数的数组作为数组数组返回=>[[a,1],[b,2],[c,3]]
最后一个可以这样使用
Object.entries(object1).map(([key, value]) => ....)
推荐阅读
- python-3.x - 哪个 API 密钥用于 IBM Speech-to-Text with IAMAuthenticator?(Python)
- json - 使用 jq 对 JSON 进行分组和计数
- c# - X509Certificate2 私钥
- c++ - 如何在 CMake 中预先构建一个库
- visual-studio-2017 - Visual Studio 2017 决定更改“起始页”上“最近”项目的顺序,现在我要解决这个问题吗?
- python - 如何在 Pytorch 中定义一个“无关”类?
- javascript - 如何使用带有表单验证的javascript将带有li的无序列表添加到div
- next.js - 如何在 _document.js Head 中有条件地渲染 amp?
- python - 通过正确的命令后,Airodump-ng 不返回任何值
- html - google recaptcha 验证后将联系我们的表单数据发送到 REST api