# Логическое значение в стейте в React

Давайте сделаем стейт `inCart`, который будет показывать, в корзине продукт или нет:

`function App() { const [inCart, setInCart] = useState(false); return <div> </div>; }`

Пусть значение `false` значит, что продукт не в корзине, а значение `true` - что в корзине. Выведем информацию об этом с помощью тернарного оператора:

`function App() { const [inCart, setInCart] = useState(false); return <div> <span>{inCart ? 'в корзине' : 'не в корзине'}</span> </div>; }`

А теперь сделаем кнопку, по нажатию на которую продукт добавится в корзину:

`function App() { const [inCart, setInCart] = useState(false); return <div> <span>{inCart ? 'в корзине' : 'не в корзине'}</span> <button onClick={() => setInCart(true)}>btn</button> </div>; }`

Модифицируем наш код так, чтобы первое нажатие на кнопку добавляло в корзину, а второе - удаляло из нее:

`function App() { const [inCart, setInCart] = useState(false); return <div> <span>{inCart ? 'в корзине' : 'не в корзине'}</span> <button onClick={() => setInCart(!inCart)}>btn</button> </div>; }`

Сделайте кнопку, нажатие на которую будет банить пользователя и кнопку, нажатие на которую будет разбанивать пользователя.

Модифицируйте предыдущую задачу так, чтобы из двух кнопок всегда была видна только соответствующая. То есть, если пользователь забанен, то видна кнопка для разбанивания, а если не забанен - для забанивания.

← →
↑