使用动态生成列重新安装/重新呈现列改变的React组件

import React, { useState } from 'react';

const DynamicColumnsComponent = () => {
  const [showColumns, setShowColumns] = useState(false);

  const handleToggleColumns = () => {
    setShowColumns(!showColumns);
  };

  return (
    <div>
      <button onClick={handleToggleColumns}>
        {showColumns ? '隐藏列' : '显示列'}
      </button>
      {showColumns && (
        <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>
          </tbody>
        </table>
      )}
    </div>
  );
};

export default DynamicColumnsComponent;