在React中获取类名有多种方法,以下是其中几种常用的方式:
<div className="my-class"></div>
要获取该div元素的类名,可以使用event.target.className
来访问。
class MyComponent extends React.Component {
constructor(props) {
super(props);
this.myRef = React.createRef();
}
handleClick() {
const className = this.myRef.current.className;
console.log(className);
}
render() {
return <div ref={this.myRef} className="my-class" onClick={() => this.handleClick()}></div>;
}
}
在上述示例中,通过this.myRef.current.className
来获取div元素的类名。
首先,安装classnames库:
npm install classnames
然后,在组件中使用classnames库来获取类名。以下是一个示例:
import classNames from 'classnames';
class MyComponent extends React.Component {
handleClick() {
const className = classNames('my-class', { 'active': true });
console.log(className);
}
render() {
return <div className={classNames('my-class', { 'active': true })} onClick={() => this.handleClick()}></div>;
}
}
在上述示例中,通过classNames('my-class', { 'active': true })
来获取类名。
以上是在React中获取类名的几种常用方法。根据具体的需求和场景,选择适合的方法来获取类名。
领取专属 10元无门槛券
手把手带您无忧上云