Skip to content

Instantly share code, notes, and snippets.

@amorkovin
Last active July 16, 2020 15:18
Show Gist options
  • Save amorkovin/dae0fa73662feabc479d8ea68b069dec to your computer and use it in GitHub Desktop.
Save amorkovin/dae0fa73662feabc479d8ea68b069dec to your computer and use it in GitHub Desktop.
Реакт: classnames и добавление классов в зависимости от state
// Как использовать библиотеку classnames
// https://github.com/JedWatson/classnames
// npm install -S classnames
import React, { Component } from "react";
import s from './OneFoods.module.css';
import cl from 'classnames';
class OneFoods extends Component {
state = {
isClick: false,
};
handleFoodsClick = () => {
this.setState( (state) => {
return {
isClick: !state.isClick
}
});
}
render() {
const { name, calorie } = this.props;
const { isClick } = this.state;
return (
<li onClick={this.handleFoodsClick} className={ cl( s.foods__item, { [s.done]: isClick} ) }>{name}, {calorie} кал.</li>
);
}
}
export default OneFoods;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment