如何使用Reactjs将对象数据渲染到表中

npm install react react-dom

import React from 'react';

function TableComponent({ data }) {
  return (
    <table>
      <thead>
        <tr>
          <th>Name</th>
          <th>Age</th>
          <th>Email</th>
        </tr>
      </thead>
      <tbody>
        {data.map((item, index) => (
          <tr key={index}>
            <td>{item.name}</td>
            <td>{item.age}</td>
            <td>{item.email}</td>
          </tr>
        ))}
      </tbody>
    </table>
  );
}

export default TableComponent;

import React from 'react';
import ReactDOM from 'react-dom';
import TableComponent from './TableComponent';

const data = [
  { name: 'John', age: 25, email: 'john@example.com' },
  { name: 'Jane', age: 30, email: 'jane@example.com' },
  { name: 'Bob', age: 35, email: 'bob@example.com' },
];

ReactDOM.render(
  <TableComponent data={data} />,
  document.getElementById('root')
);