【React】classnames 库(可添加多个 className 类名)

文章目录

前言:在项目中我们有时候需要添加多个className,这时候就需要用到这个库了

  • 例如:我们想得到这样一个效果
html 复制代码
<div class='class1 class2'></div>
  • 但是在react中,我们没办法像上面那样去实现,所以我们得借助一个工具库classnames
shell 复制代码
# 安装
npm install classnames --save
  • 使用案例:
js 复制代码
import classnames from 'classnames'
import styles from './index.module.css';

export default function(props){
	return <div className={classNames(styles.myProTable, props?.className)}></div>
}
相关推荐
wordbaby1 分钟前
如何封装一个生产级的 React Native 分页列表 Hook
前端·react native·react.js
小帅不太帅6 分钟前
我做了两个工具,一个 7MB 的壳,一个会记住的壳
前端·app·产品
不瘦80斤不改名22 分钟前
HTML基础(一)
开发语言·前端·html
UXbot25 分钟前
AI画原型工具如何帮非设计师快速生成UI界面
前端·vue.js·ui·kotlin·swift·原型模式·web app
前端若水28 分钟前
原生嵌套(Nesting):以后还写 SCSS 吗?
前端·css·scss
兄弟加油,别颓废了。34 分钟前
系统全功能详细操作手册,从启动到测试
前端·chrome
ZC跨境爬虫1 小时前
跟着 MDN 学 HTML day_32:(AbstractRange 抽象接口与 DOM 范围操作)
前端·javascript·ui·html·音视频
十子木1 小时前
设置把所有终端移动到最前端的快捷键
前端
陈老老老板1 小时前
Bright Data Web Scraping 实战:用 MCP + Dify 构建 eBay 商品详情采集 AI 工作流(2026)
前端·人工智能
一渊之隔1 小时前
uniapp蓝牙搜索连接展示蓝牙设备包含信号显示
前端·网络·uni-app·bluetooth