我需要一次折叠表中的一行。我用过材料(React JS)可折叠的桌子

import React, { useState } from 'react';

const Table = () => {
  const [isRowCollapsed, setIsRowCollapsed] = useState(true);

  const handleRowToggle = () => {
    setIsRowCollapsed(!isRowCollapsed);
  };

  return (
    <table>
      <thead>
        <tr>
          <th>表头1</th>
          <th>表头2</th>
          <th>表头3</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>数据1</td>
          <td>数据2</td>
          <td>数据3</td>
        </tr>
        <tr>
          <td colSpan="3">
            <button onClick={handleRowToggle}>
              {isRowCollapsed ? '展开' : '折叠'}
            </button>
            {!isRowCollapsed && (
              <div>
                <p>详细信息1</p>
                <p>详细信息2</p>
                <p>详细信息3</p>
              </div>
            )}
          </td>
        </tr>
      </tbody>
    </table>
  );
};

export default Table;