У меня есть компонент древовидного меню, который выводит следующий формат:
<li class = "rct-node rct-node-parent rct-node-collapsed">
<span class = "rct-title">192.168.1.61</span></span></span></li>
Мне нужно получить класс li при щелчке по значению «rct-title», чтобы я мог запустить условный оператор, если класс «rct-node». Я новичок в JS, и мне интересно, есть ли простой способ сделать это.
🤔 А знаете ли вы, что...
JavaScript поддерживает работу с графикой и аудио, что позволяет создавать мультимедийные веб-приложения.
Обратите внимание, что class не является допустимым синтаксисом для React (jsx), он должен быть className
Сказав это, вы можете использовать e.target.parentElement.className
Вот так:
class App extends Component {
handleGetClassName = e => {
console.info(e.target.parentElement.className);
};
render() {
return (
<div>
<li
className = "rct-node rct-node-parent rct-node-collapsed"
onClick = {this.handleGetClassName}
>
<span className = "rct-title">192.168.1.61</span>
</li>
</div>
);
}
}
Будет console.info строка rct-node rct-node-parent rct-node-collapsed
ОБНОВИТЬ:
Если вам нужно только первое className, вы можете сделать это:
handleGetClassName = e => {
const className = e.target.parentElement.className.split(' ')[0];
console.info(className);
};
Теперь он даст вам только rct-node