react如何添加类名

添加类名的基本方法

在React中可以通过className属性为元素添加类名，这与HTML中的class属性等效。例如：

<div className="my-class">内容</div>

动态类名拼接

需要根据条件动态添加类名时，可以使用模板字符串或第三方库如classnames：

// 模板字符串方式
<div className={`base-class ${isActive ? 'active' : ''}`}>

// classnames库用法
import cn from 'classnames';
<div className={cn('base-class', { 'active': isActive })}>

样式模块化处理

使用CSS Modules时，需通过模块化导入的方式引用类名：

import styles from './styles.module.css';
<div className={styles.container}>

第三方库集成

对于复杂的类名逻辑，推荐使用clsx或classnames库：

import clsx from 'clsx';
<div className={clsx('static-class', { 'conditional-class': condition })}>