显示或隐藏从数组呈现的React组件，仅显示特定组件

import React from 'react';

const ComponentArray = ({ components }) => {
  return (
    <div>
      {components.map((Component, index) => (
        <Component key={index} />
      ))}
    </div>
  );
};

export default ComponentArray;

import React, { useState } from 'react';
import ComponentArray from './ComponentArray';

const ParentComponent = () => {
  const [showComponent, setShowComponent] = useState(false);

  const components = [
    Component1,
    Component2,
    Component3,
    // 添加更多组件
  ];

  const toggleComponent = () => {
    setShowComponent(!showComponent);
  };

  return (
    <div>
      <button onClick={toggleComponent}>
        {showComponent ? '隐藏组件' : '显示组件'}
      </button>
      {showComponent && <ComponentArray components={components} />}
    </div>
  );
};

export default ParentComponent;