Компоненты в Livewire

Обычная страница Laravel собирается целиком: маршрут отдаёт одно представление, и в нём лежит вся разметка. Кусок с карточкой поста или блоком просмотров при этом не отделён от шапки и подвала. Данные и HTML перемешаны в одном файле, и править фрагмент неудобно.

Компонент отвечает за один фрагмент страницы, а не за всю страницу целиком. У него свои данные и свои действия: показать число просмотров, дописать заголовок в список, обновить подпись после клика. Остальная страница остаётся обычным шаблоном Blade и просто оставляет компоненту место в разметке.

Так логика фрагмента не расползается по контроллеру и общему шаблону. Всё, что относится к блоку, лежит рядом и читается само по себе. На одной странице может быть несколько компонентов, и каждый хранит только своё.

Компонент состоит из двух связанных частей. PHP-класс хранит данные фрагмента и методы, которые их меняют. Blade-шаблон рисует HTML этого фрагмента и выводит данные класса. Имя класса и имя шаблона согласованы, поэтому фреймворк сам находит разметку для класса.

Класс размещают в папке компонентов, шаблон - в папке шаблонов компонентов. Например, карточка поста - это класс PostCard и шаблон post-card.blade.php.

Когда данные компонента меняются, обновляется только его шаблон на странице. Остальная разметка при этом не собирается заново.

Со всем этим мы и будем разбираться в рамках данного раздела.