首页 > 解决方案 > 我如何循环遍历对象内部的数组。并在 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 });

标签: reactjsloopsjavascript-objects

解决方案


您可以使用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]) => ....)

推荐阅读