В моем случае путь JAVA не был установлен в переменные Env. Начал работать после того, как правильный путь был установлен в Env PATH.
Введите javac в командной строке и убедитесь, что JAVA PATH верен.
Вы можете использовать этот пакет: https://github.com/JedWatson/classnames
Пример с состоянием кнопки:
var classNames = require('classnames');
var Button = React.createClass({
// ...
render () {
var btnClass = classNames({
btn: true,
'btn-pressed': this.state.isPressed,
'btn-over': !this.state.isPressed && this.state.isHovered
});
return <button className={btnClass}>{this.props.label}</button>;
}
});
Я бы предложил перевести <i className="fas fa-align-left" data-align="Left" onClick={this.handleAlign}></i>
в отдельный компонент , и состояние удерживать его, а затем отобразить это состояние , чтобы отобразить это. ]
this.state ={
Alignments:[], // Please add all your allingments here
Colors:[], // Please add all your Color here
Sizes:[], // Please add all your Size here
activeAlingment:0,
activeColor:0,
activeSize:0
}
handleSetActiveAllingment = (index) =>{
this.setState({activeAlingment:index})
}
handleSetActiveColor = (index) =>{
this.setState({activeColor:index})
}
handleSetActiveSize = (index) =>{
this.setState({activeSize:index})
}
Пожалуйста, используйте это состояние, чтобы отобразить через это состояние для создания Компонентов.
this.state.Alignments.map((alingment,Index)=>{
isactive = this.state.activeAlingment == Index ? "active" : "";
return <Alingment activeClass={isactive} clickHandler={() => this.handleSetActiveAllingment(Index)}>
});
this.state.Colors.map((color,Index)=>{
isactive = this.state.activeColor == Index ? "active" : "";
return <Colors activeClass={isactive} clickHandler={()=>this.handleSetActiveColor(Index)}>
});
Таким образом, ваши компоненты будут многократно использоваться , и вы также получите то, что вам нужно.
Используйте приведенные ниже фрагменты и интерполяцию строк для выполнения работы:
const classnames = someCondition? "color-cont black": "color-cont black newStyle others";
<div className=`$(classnames)` ...>