如何在控件渲染时显示一些动画？

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.control {
  animation: fadeIn 2s;
}

// 引入 GSAP 库
import { TweenMax } from "gsap";

// 创建动画
TweenMax.from(".control", 2, { opacity: 0 });

import { CSSTransition } from "react-transition-group";

function MyComponent() {
  const [show, setShow] = useState(false);

  return (
    <>
     <button onClick={() => setShow(!show)}>Toggle</button>
      <CSSTransition in={show} timeout={200} classNames="fade" unmountOnExit>
        <div className="control">Hello, world!</div>
      </CSSTransition>
    </>
  );
}