如何在切换时隐藏react本机组件

import React, { useState } from 'react';

function ParentComponent() {
  const [isHidden, setIsHidden] = useState(false);

  const handleToggle = () => {
    setIsHidden(!isHidden);
  };

  return (
    <div>
      <button onClick={handleToggle}>切换</button>
      {!isHidden && <ChildComponent />}
    </div>
  );
}

.hidden {
  display: none;
}

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

function ParentComponent() {
  const [isHidden, setIsHidden] = useState(false);

  const handleToggle = () => {
    setIsHidden(!isHidden);
  };

  return (
    <div>
      <button onClick={handleToggle}>切换</button>
      <ChildComponent className={isHidden ? 'hidden' : ''} />
    </div>
  );
}