Представлення (Views / HTML-шаблони)
- Вступ
- Створення та відображення представлень
- Передача даних у представлення
- Компонувальники представлень
- Оптимізація Представлень
Вступ
Звичайно, не практично повертати цілі HTML-документи у вигляді рядків безпосередньо з ваших маршрутів і контролерів. На щастя, представлення (views) надають зручний спосіб розміщення всього нашого HTML в окремих файлах.
Відображення відокремлюють вашу логіку контролера / застосунку від логіки представлення і зберігаються в каталозі resources/views. При використанні Laravel, шаблони відображень зазвичай пишуться з використанням мови шаблонів Blade. Просте відображення може виглядати приблизно так:
<!-- Представлення збережене в 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.
Наші стартові набори застосунків React та Vue надають вам чудову відправну точку для вашого наступного Laravel-застосунку на базі Inertia.
Створення та Відображення Представлень
Ви можете створити представлення, розмістивши файл з розширенням .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('admin.profile')) {
// ...
}
Передача даних у представлення
Як ви бачили в попередніх прикладах, ви можете передати масив даних у представлення, щоб зробити ці дані доступними для представлення:
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\AppServiceProvider міститиме цю логіку.
Ми використаємо метод 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 AppServiceProvider 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) { // ... }); } }
Тепер, коли ми зареєстрували компонувальник, метод compose класу App\View\Composers\ProfileComposer буде виконуватись кожного разу, коли представлення profile буде відображатись. Давайте розглянемо приклад класу компонувальника:
<?php
namespace App\View\Composers;
use App\Repositories\UserRepository;
use Illuminate\View\View;
class ProfileComposer
{
/**
* Створити новий профіль composer.
*/
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
);
Метод компонувальник також приймає символ * як підстановочний знак, дозволяючи вам прикріпити компонувальник до всіх представлень:
use Illuminate\Support\Facades;
use Illuminate\View\View;
Facades\View::composer('*', function (View $view) {
// ...
});
Створювачі Представлень
"Створювачі" представлень дуже схожі на компонувальники представлень; однак вони виконуються відразу після створення представлення, замість очікування до моменту, коли представлення буде готове до рендерингу. Щоб зареєструвати створювач представлення, використовуйте метод 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
