Условный рендеринг и списки

Часть курса React

Почти любой экран, которым вы когда-либо пользовались, показывает одно вместо другого в зависимости от какого-то условия: плашка «у вас новые сообщения», которая появляется только когда сообщения действительно есть, крутящийся индикатор, который виден только пока что-то загружается. И почти любой экран показывает не одну штуку чего-нибудь, а много: список заказов, сетку товаров, ленту записей.

Представьте швейцара, который стоит перед залом. Прежде чем кого-то пустить, он проверяет ровно одну вещь. Проверка прошла, человек входит. Проверка не прошла, не происходит вообще ничего: ни объяснений, ни заглушки, только молчание и закрытая дверь. Именно этим и занимается && (логическое И) внутри выражения JSX: когда вы пишете condition && <SomeElement />, React отрисовывает <SomeElement /> только при истинном...