向ReactJS中的某个元素添加类

import React from 'react';

function MyComponent() {
  return <div className="static-class">Hello, World!</div>;
}

export default MyComponent;

import React, { useState } from 'react';

function ToggleClassComponent() {
  const [isActive, setIsActive] = useState(false);

  return (
    <div>
      <button onClick={() => setIsActive(!isActive)}>Toggle Class</button>
      <div className={`base-class ${isActive ? 'active-class' : ''}`}>
        Click the button to toggle class
      </div>
    </div>
  );
}

export default ToggleClassComponent;

import React from 'react';
import './styles.css'; // 确保CSS文件已导入

function MyComponent() {
  return <div className="my-component">Hello, World!</div>;
}

export default MyComponent;

.my-component {
  color: blue;
}