reactjs -使用props将数据插入到表中

import React from 'react';

// 表格行组件
const TableRow = (props) => {
  return (
    <tr>
      <td>{props.name}</td>
      <td>{props.age}</td>
      <td>{props.email}</td>
    </tr>
  );
};

// 表格组件
const Table = () => {
  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' },
  ];

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

export default Table;