Javascript 如何使用React渲染对象列表

后端开发人员在这里。（做一个快速而零碎的项目，所以请原谅我问了一个n00b问题）

我需要使用React以表格格式呈现此文件

---

我看了一些这样的例子，但没有帮助。有谁能指导我找到一个代码笔或一个入门项目，我可以研究它来完成这项工作吗？我不知道如何映射数组中的对象

您可以参考React.JS的文档

但对于您的情况，如果要将对象数组渲染为

表

，可以使用

jsx

中的

map

array prototype来实现

[{"id":8,"name":"christoph","age":32,"number":"555-555-5555"},
{"id":9,"name":"debra","age":31,"number":"555-555-5555"},
{"id":10,"name":"eric","age":29,"number":"555-555-5555"},
{"id":19,"name":"richard","age":20,"number":"555-555-5555"},
{"id":14,"name":"santiago","age":25,"number":"(555)555-5555"}]

const persons=[
{身份证号码：8，姓名：“克里斯托夫”，年龄：32岁，号码：“555-555-5555”}，
{身份证号码：9，姓名：“黛布拉”，年龄：31，号码：“555-555-5555”}，
{身份证号码：10，姓名：“埃里克”，年龄：29岁，号码：“555-555-5555”}，
{身份证号码：19，姓名：“理查德”，年龄：20，号码：“555-555-5555”}，
{id:14，姓名：“圣地亚哥”，年龄：25，号码：“（555）555-5555”}，
]
返回(
#
名称
年龄
数
{persons.map（person=>(
{person.id}
{person.name}
{个人年龄}
{个人号码}
))}
)

---

我想这应该行。

只要使用

map

这样的方法：

array.map（data=>{data.name}）

我添加了一个新问题：。你能帮忙吗？

const persons = [
  { id: 8, name: "christoph", age: 32, number: "555-555-5555" },
  { id: 9, name: "debra", age: 31, number: "555-555-5555" },
  { id: 10, name: "eric", age: 29, number: "555-555-5555" },
  { id: 19, name: "richard", age: 20, number: "555-555-5555" },
  { id: 14, name: "santiago", age: 25, number: "(555)555-5555" },
]

return (
  <table class="table">
    <thead>
      <tr>
        <th scope="col">#</th>
        <th scope="col">Name</th>
        <th scope="col">Age</th>
        <th scope="col">Number</th>
      </tr>
    </thead>
    <tbody>
      {persons.map(person => (
        <tr key={person.id}>
          <th scope="row">{person.id}</th>
          <td>{person.name}</td>
          <td>{person.age}</td>
          <td>{person.number}</td>
        </tr>
      ))}
    </tbody>
  </table>
)