如何在表中呈现React中的状态数组

import React, { Component } from 'react';

class Table extends Component {
  constructor(props) {
    super(props);
    this.state = {
      data: [
        { id: 1, name: 'John', date: '2022-01-01' },
        { id: 2, name: 'Jane', date: '2022-01-02' },
        { id: 3, name: 'Tom', date: '2022-01-03' }
      ]
    };
  }

  renderTable() {
    return this.state.data.map((item) => (
      <tr key={item.id}>
        <td>{item.id}</td>
        <td>{item.name}</td>
        <td>{item.date}</td>
      </tr>
    ));
  }

  render() {
    return (
      <table>
        <thead>
          <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Date</th>
          </tr>
        </thead>
        <tbody>
          {this.renderTable()}
        </tbody>
      </table>
    );
  }
}

export default Table;