Views в Laravel 10.x - Руководство и Примеры

Введение
- Написание представлений на React / Vue
Создание и рендеринг представлений
Передача данных в представления
- Обмен данными со всеми представлениями
Композеры представлений
- Создание представлений
Оптимизация представлений

Введение

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

Представления отделяют логику вашего контроллера / приложения от логики представления и хранятся в каталоге resources/views. При использовании Laravel шаблоны представлений обычно написаны с использованием языка шаблонов Blade. Простое представление может выглядеть примерно так:

<!-- View stored in resources/views/greeting.blade.php -->
 
<html>
    <body>
        <h1>Hello, {{ $name }}</h1>
    </body>
</html>

Поскольку это представление хранится в resources/views/greeting.blade.php, мы можем вернуть его, используя глобальный помощник view, следующим образом:

Route::get('/', function () {
    return view('greeting', ['name' => 'James']);
});

Примечание Ищете больше информации о том, как писать шаблоны Blade? Ознакомьтесь с полной документацией по Blade, чтобы начать работу.

Написание представлений на React / Vue

Вместо того чтобы писать свои шаблоны фронтенда на PHP через Blade, многие разработчики предпочитают писать их, используя React или Vue. Laravel облегчает этот процесс благодаря Inertia, библиотеке, которая упрощает связь вашего фронтенда React / Vue с вашим бэкендом Laravel без типичных сложностей создания SPA.

Наши стартовые комплекты Breeze и Jetstream starter kits предоставляют отличную отправную точку для вашего следующего приложения Laravel, работающего на Inertia. Кроме того, Laravel Bootcamp предоставляет полную демонстрацию создания приложения Laravel, работающего на Inertia, включая примеры в Vue и React.

Создание и рендеринг представлений

Вы можете создать представление, разместив файл с расширением .blade.php в каталоге resources/views вашего приложения или используя команду Artisan make:view:

php artisan make:view greeting

Расширение .blade.php информирует фреймворк о том, что файл содержит шаблон Blade. Шаблоны Blade содержат HTML, а также директивы Blade, которые позволяют легко выводить значения, создавать операторы "if", выполнять итерации по данным и многое другое.

После создания представления вы можете вернуть его из одного из маршрутов или контроллеров вашего приложения, используя глобальный помощник view:

Route::get('/', function () {
    return view('greeting', ['name' => 'James']);
});

Представления также могут быть возвращены с использованием фасада View:

use Illuminate\Support\Facades\View;
 
return View::make('greeting', ['name' => 'James']);

Как видно, первый аргумент, передаваемый в помощник view, соответствует имени файла представления в каталоге resources/views. Второй аргумент - это массив данных, который должен быть доступен представлению. В данном случае мы передаем переменную name, которая отображается в представлении с использованием синтаксиса Blade.

Вложенные каталоги представлений

Представления также могут быть вложены в подкаталоги каталога resources/views. Для ссылки на вложенные представления можно использовать "точечную" запись. Например, если ваше представление хранится в resources/views/admin/profile.blade.php, вы можете вернуть его из одного из маршрутов или контроллеров вашего приложения следующим образом:

return view('admin.profile', $data);

Внимание Имена каталогов представлений не должны содержать символ ..

Создание первого доступного представления

С использованием метода first фасада View вы можете создать первое представление, существующее в данном массиве представлений. Это может быть полезно, если ваше приложение или пакет позволяет настраивать или перезаписывать представления:

use Illuminate\Support\Facades\View;
 
return View::first(['custom.admin', 'admin'], $data);

Определение наличия представления

Если вам нужно определить, существует ли представление, вы можете использовать фасад View. Метод exists вернет true, если представление существует:

use Illuminate\Support\Facades\View;
 
if (View::exists('emails.customer')) {
    // ...
}

Передача данных в представления

Как вы видели в предыдущих примерах, вы можете передавать массив данных в представления, чтобы сделать эти данные доступными в представлении:

return view('greetings', ['name' => 'Victoria']);

При передаче информации таким образом данные должны быть массивом с парами ключ / значение. После предоставления данных представлению, вы можете обращаться к каждому значению внутри вашего представления, используя ключи данных, например, <?php echo $name; ?>.

Как альтернативу передаче полного массива данных в функцию помощника view, вы можете использовать метод with для добавления отдельных частей данных в представление. Метод with возвращает экземпляр объекта представления, так что вы можете продолжать цепочку методов, прежде чем вернуть представление:

return view('greeting')
            ->with('name', 'Victoria')
            ->with('occupation', 'Astronaut');

Обмен данными со всеми представлениями

Иногда вам может потребоваться обмениваться данными со всеми представлениями, которые рендерит ваше приложение. Вы можете сделать это, используя метод share фасада View. Обычно вызовы метода share размещаются в методе boot провайдера службы. Вы можете добавить их в класс App\Providers\AppServiceProvider или создать отдельный провайдер службы для этого:

<?php
 
namespace App\Providers;
 
use Illuminate\Support\Facades\View;
 
class AppServiceProvider extends ServiceProvider
{
    /**
     * Зарегистрируйте любые службы приложения.
     */
    public function register(): void
    {
        // ...
    }
 
    /**
     * Инициализируйте любые службы приложения.
     */
    public function boot(): void
    {
        View::share('key', 'value');
    }
}

Композеры представлений

Композеры представлений - это обратные вызовы или методы класса, которые вызываются при рендеринге представления. Если у вас есть данные, которые вы хотите привязать к представлению каждый раз, когда это представление рендерится, композер представлений может помочь вам организовать эту логику в одном месте. Композеры представлений могут быть особенно полезны, если одно и то же представление возвращается несколькими маршрутами или контроллерами в вашем приложении и всегда требуется определенная часть данных.

Обычно композеры представлений регистрируются в одном из провайдеров служб вашего приложения. В этом примере предполагается, что мы создали новый App\Providers\ViewServiceProvider для размещения этой логики.

Мы будем использовать метод composer фасада View для регистрации композера представлений. Laravel не включает в себя каталог по умолчанию для композеров представлений на основе классов, поэтому вы можете организовать их так, как вам удобно. Например, вы можете создать каталог app/View/Composers, чтобы разместить все композеры представлений вашего приложения:

<?php
 
namespace App\Providers;
 
use App\View\Composers\ProfileComposer;
use Illuminate\Support\Facades;
use Illuminate\Support\ServiceProvider;
use Illuminate\View\View;
 
class ViewServiceProvider extends ServiceProvider
{
    /**
     * Зарегистрируйте любые службы приложения.
     */
    public function register(): void
    {
        // ...
    }
 
    /**
     * Инициализируйте любые службы приложения.
     */
    public function boot(): void
    {
        // Использование композеров на основе классов...
        Facades\View::composer('profile', ProfileComposer::class);
 
        // Использование композеров на основе замыканий...
        Facades\View::composer('welcome', function (View $view) {
            // ...
        });
 
        Facades\View::composer('dashboard', function (View $view) {
            // ...
        });
    }
}

Внимание Помните, если вы создаете новый провайдер услуг для регистрации вашего композитора представлений, вам нужно добавить провайдер услуг в массив providers в конфигурационном файле config/app.php.

Теперь, когда мы зарегистрировали композер, метод compose класса App\View\Composers\ProfileComposer будет выполняться каждый раз, когда рендерится представление profile. Давайте рассмотрим пример класса композера:

<?php
 
namespace App\View\Composers;
 
use App\Repositories\UserRepository;
use Illuminate\View\View;
 
class ProfileComposer
{
    /**
     * Создайте нового композера профиля.
     */
    public function __construct(
        protected UserRepository $users,
    ) {}
 
    /**
     * Привяжите данные к представлению.
     */
    public function compose(View $view): void
    {
        $view->with('count', $this->users->count());
    }
}

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

Привязка композера к нескольким представлениям

Вы можете присоединить композер представления к нескольким представлениям сразу, передав массив представлений в качестве первого аргумента методу composer:

use App\Views\Composers\MultiComposer;
use Illuminate\Support\Facades\View;
 
View::composer(
    ['profile', 'dashboard'],
    MultiComposer::class
);

Метод composer также принимает символ * в качестве метасимвола, позволяя привязать композер ко всем представлениям:

use Illuminate\Support\Facades;
use Illuminate\View\View;
 
Facades\View::composer('*', function (View $view) {
    // ...
});

Создание представлений

Представления "creators" очень похожи на композеры представлений; однако они выполняются сразу после создания представления, а не ожидая, пока представление собирается. Чтобы зарегистрировать представление "creator", используйте метод creator:

use App\View\Creators\ProfileCreator;
use Illuminate\Support\Facades\View;
 
View::creator('profile', ProfileCreator::class);

Оптимизация представлений

По умолчанию представления Blade компилируются по мере необходимости. Когда выполняется запрос, рендерящий представление, Laravel определит, существует ли скомпилированная версия представления. Если файл существует, Laravel затем определит, был ли нескомпилированный вид изменен более недавно, чем скомпилированный вид. Если скомпилированное представление не существует или нескомпилированный вид был изменен, Laravel перекомпилирует представление.

Компиляция представлений во время запроса может иметь небольшое негативное влияние на производительность, поэтому Laravel предоставляет команду Artisan view:cache для предварительной компиляции всех представлений, используемых вашим приложением. Для повышения производительности вы можете запускать эту команду в рамках вашего процесса развертывания:

php artisan view:cache

Вы можете использовать команду view:clear для очистки кэша представлений:

php artisan view:clear

Представления

Присоединяйся к нашему Telegram сообществу @webblend!