Отрисовка по условию: переменные элементы | OTUS

Отрисовка по условию: переменные элементы

В React существует возможность применять переменные в целях хранения элементов. Это поможет разработчику отрисовать по условию часть компонента, при этом оставшаяся часть вывода не поменяется. Рассмотрим, как это работает.

Ниже -- 2 новых компонента, которые представляют кнопки для авторизации и выхода:

1-1801-7c776a.png

Теперь давайте создадим компонент с состоянием и с именем LoginControl. Данный компонент станет отрисовывать или <LoginButton />, или <LogoutButton />, что зависит от текущего состояния. Вдобавок ко всему, созданный компонент отрисует <Greeting /> из предыдущего примера.

Итак, смотрим реализацию:

2-1801-b3e82f.png

Итак, объявление переменной вкупе с применением оператора if — хороший способ отрисовать компонент по условию. Однако в некоторых случаях можно применять и более короткий синтаксис. Но об этом читайте в наших следующих статьях.

По материалам https://ru.react.js.org/.

Не пропустите новые полезные статьи!

Спасибо за подписку!

Мы отправили вам письмо для подтверждения вашего email.
С уважением, OTUS!

Автор
0 комментариев
Для комментирования необходимо авторизоваться