【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>
}
相关推荐
css趣多多9 分钟前
vue环境变量
前端
RFCEO10 分钟前
前端编程 课程十五、:CSS核心基础3:文字+段落样式
前端·css·文字+段落样式·css文本样式·美化页面文本内容·演示动画说明·单行文字垂直居中技
摇滚侠10 分钟前
【程序员入门系列】jQuery 零基础入门到精通!Jquery 选择器 API
前端·javascript·jquery
源力祁老师22 分钟前
深入解析 Odoo 中 default_get 方法的功能
java·服务器·前端
sleeppingfrog1 小时前
zebra打印机实现前端打印
前端
摇滚侠1 小时前
前端判断不等于 undefined 不等于 null 的方法
前端
●VON1 小时前
React Native for OpenHarmony:贪吃蛇游戏的开发与跨平台适配实践
学习·react native·react.js·游戏·openharmony
DFT计算杂谈1 小时前
VASP+Wannier90 计算位移电流和二次谐波SHG
java·服务器·前端·python·算法
zhougl9961 小时前
Vue 中使用 WebSocket
前端·vue.js·websocket
无名的小白2 小时前
openclaw使用nginx反代部署过程 与disconnected (1008): pairing required解决
java·前端·nginx