Простое объяснение Laravel Blade компонентов
Если совсем коротко, то есть каркас страницы app-layout.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
<!DOCTYPE html> <html lang="{{ str_replace('_', '-', app()->getLocale()) }}"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Laravel Blade с Компонентом</title> <link href="https://fonts.googleapis.com/css?family=Nunito:200,600" rel="stylesheet"> <style> html, body { background-color: #fff; color: #636b6f; font-family: 'Nunito', sans-serif; font-weight: 200; height: 100vh; margin: 0; } .content { text-align: center; } </style> </head> <body> <div class="content"> @yield('content') </div> </body> </html> |
и файл welcome.blade.php с неким содержимым.
Макетный подход
Файл welcome.blade.php:
|
1 2 3 4 |
@extends('layout/app-layout'); @section('content') Это содержимое @endsection |
Старый компонентный подход
В каркасе изменится:
|
1 2 3 4 5 6 7 |
... <body> <div class="content"> {{ $slot }} </div> </body> ... |
Файл welcome.blade.php:
|
1 2 3 |
@component('layout.app-layout') С компонентным подходом @endcomponent |
Новый компонентный подход
Файл welcome.blade.php:
|
1 2 3 |
<x-app-layout> Мы используем кастомный тег также, как и компонент </x-app-layout> |
Контент тега будет отображаться через {{ $slot }} в файле components\app-layout.blade.php.
Более подробная инфа по ссылке на статью
Recommended Posts
Не работает autocomplete в моделях Laravel
01.02.2022