在单击react js按钮时添加和删除css文件

<button onClick={handleClick}>按钮</button>

function handleClick() {
  // 添加CSS文件
  const link = document.createElement('link');
  link.href = 'path/to/your/css/file.css';
  link.rel = 'stylesheet';
  document.head.appendChild(link);

  // 删除CSS文件
  const cssFiles = document.querySelectorAll('link[href="path/to/your/css/file.css"]');
  cssFiles.forEach((file) => {
    file.remove();
  });
}

import React, { useState } from 'react';

function App() {
  const [showCSS, setShowCSS] = useState(false);

  function handleClick() {
    setShowCSS(!showCSS);
  }

  return (
    <div>
      {showCSS && <link href="path/to/your/css/file.css" rel="stylesheet" />}
      <button onClick={handleClick}>切换CSS文件</button>
    </div>
  );
}