Maison > Article > cadre php > Développement Laravel : Comment utiliser la disposition du modèle Laravel Blade ?

Développement Laravel : Comment utiliser la disposition du modèle Laravel Blade ?

WBOYoriginal: 2023-06-14 10:41:19960parcourir

Laravel est un excellent framework de développement basé sur PHP. Il présente les avantages d'être facile à prendre en main, efficace et sûr, et est profondément apprécié des développeurs WEB. Parmi eux, la disposition des modèles Laravel Blade est une fonction très pratique dans le framework Laravel. Cet article vous montrera comment utiliser la disposition des modèles Laravel Blade à travers des cas réels.

Qu'est-ce que la disposition du modèle Blade ?

Le moteur de modèles Blade est le moteur d'affichage par défaut du framework Laravel. Comparé au moteur de modèles de la syntaxe native de PHP, Blade prend en charge une syntaxe plus concise et élégante et peut être mieux utilisé avec le framework Laravel. La disposition du modèle Laravel Blade fait référence à la division de la page Web en une combinaison modulaire de contenu d'en-tête, de queue, de barre latérale et de bloc pour faciliter le développement séparé et améliorer l'efficacité du développement.

Créer le modèle maître de mise en page

Dans Laravel, nous pouvons utiliser la commande artisan pour générer le modèle maître de mise en page. Les étapes spécifiques sont les suivantes :

php artisan make:layout masterphp artisan make:layout master

执行该命令后，在项目resources/views/layouts/目录下会生成一个名为master.blade.php的主模板文件。打开该文件，可以看到其中的代码内容如下：

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>@yield('title')</title>
</head>
<body>
    <header>
        @yield('header')
    </header>
    <nav>
        @yield('nav')
    </nav>
    <main>
        @yield('content')
    </main>
    <footer>
        @yield('footer')
    </footer>
</body>
</html>

我们可以看到，模板文件中包含了头部、尾部、导航栏、主体等不同的区块，使用Blade模板语法的@yield()函数来占位，这里的@yield()函数定义了一个模板区块，以后我们将在其他视图文件中使用@section()函数填充这些模板区块。

替换被继承的子视图

对于任何需要使用布局的视图文件，都可以通过继承主模板来进行布局。打开视图文件，添加如下代码：

@extends('layouts.master').

Après avoir exécuté cette commande, un fichier de modèle principal nommé master.blade.php sera généré dans le répertoire resources/views/layouts/ du projet. Ouvrez le fichier et vous pouvez voir que le contenu du code est le suivant :

@section('title', '页面标题')
@section('header')
    <h1>头部内容</h1>
@endsection
@section('nav')
    <ul>
        <li><a href="#">导航栏1</a></li>
        <li><a href="#">导航栏2</a></li>
        <li><a href="#">导航栏3</a></li>
    </ul>
@endsection
@section('content')
    <p>主体内容</p>
@endsection
@section('footer')
    <p>版权信息</p>
@endsection

Nous pouvons voir que le fichier modèle contient différents blocs tels que la tête, la queue, la barre de navigation, le corps, etc., en utilisant @yield() du modèle Blade fonction de syntaxe pour occuper l'espace. La fonction @yield() définit ici un bloc modèle. Nous utiliserons la fonction @section() dans d'autres fichiers de vue pour remplir ces blocs modèles à l'avenir.

Pour tout fichier de vue qui doit utiliser la mise en page, vous pouvez le mettre en forme en héritant du modèle principal. Ouvrez le fichier de vue et ajoutez le code suivant :

@extends('layouts.master')

@extends('layouts.master') signifie ici que le fichier de vue actuel hérite du fichier de vue principal. fichier modèle layouts.master . Ensuite, vous pouvez remplir ces blocs de modèle avec les noms de bloc de modèle définis par la fonction @yield(). Par exemple, vous pouvez ajouter le code suivant au fichier de vue :

    <?php

    namespace AppHttpControllers;

    use IlluminateHttpRequest;
    use IlluminateSupportFacadesView;

    class HomeController extends Controller
    {
        public function index()
        {
            $data = [
                'title' => '页面标题',
                'header' => '<h1>头部内容</h1>',
                'nav' => '<ul>
                            <li><a href="#">导航栏1</a></li>
                            <li><a href="#">导航栏2</a></li>
                            <li><a href="#">导航栏3</a></li>
                          </ul>',
                'content' => '<p>主体内容</p>',
                'footer' => '<p>版权信息</p>'
            ];
            return View::make('home.index', $data);
        }
    }

En plus de la fonction @yield() et de la fonction @section(), Laravel fournit également des méthodes statiques de View. Il est recommandé d'utiliser cette méthode. Les étapes de mise en œuvre spécifiques sont les suivantes :

@section('content')
    <div>
        @foreach ($posts as $post)
            <h2>{{ $post->title }}</h2>
            <p>{{ substr($post->content, 0, 100) }}</p>
        @endforeach
    </div>
@endsection

Dans le code ci-dessus, nous avons utilisé View::make pour générer la vue et avons passé dans une instance de tableau $data comme contexte variable de la vue. Dans ce tableau, nous avons défini cinq variables : $title, $header, $nav, $content, $footer, etc., qui sont utilisées pour remplir les blocs de modèle correspondants dans le modèle principal.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

php laravel html if for foreach 循环继承

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Développement Laravel : Comment renvoyer une réponse en utilisant Laravel Response ?Article suivant：Développement Laravel : Comment renvoyer une réponse en utilisant Laravel Response ?

Articles Liés

Voir plus