Laravel
投稿日
投稿者 dennie

Bladeテンプレート ディレクティブの使用例 Laravel5.8

前回は共通レイアウトの使用例を説明しました。
今回は前回使用したディレクティブとその他のディレクティブについて説明します。
前提
ファイル構成
今回使用するファイルの構成は以下の通りです。
ファイル名 説明
resources/views/layouts/main.blade.php 親ビュー(レイアウトファイル)
resources/views/directive/directive.blade.php 子ビュー(コンテンツファイル)
resources/views/directive/include.blade.php 外部読み込みファイル
routes/web.php ルーティングファイル
ルーティング
ルーティングは以下の通りです。

Route::get('/directive', function () {
    return view('directive.directive');
});
php記述
@phpディレクティブはphpスクリプトの記述が可能です。 
@php
  $value = 1;
@endphp
継承
子ビューでは親ビューを継承し、使用することが出来ます。Bladeテンプレート 共通レイアウトの利用を参照して下さい。
コンテンツの読み込み
@yield, @section
親ビューで@yieldディレクティブを使用した場合、子ビューの@sectionディレクティブを読み込みます。
子ビューの@sectionディレクティブでは、親ビューの@yieldディレクティブで指定した第一引数と同じ内容を第一引数に指定します。
以下、親ビューの例では@yieldディレクティブに’title’を指定しています。
また子ビューの例でも@sectionディレクティブの第一引数を’title’としています。
さらに、@sectionディレクティブで第二引数を指定すると、画面にその内容を表示します。
第二引数を指定した場合、@endsectionの記載を省略出来ます。
・layouts/main.blade.php 
<html>
    <head></head>
    <body>
        <main>
 
          <h1>タイトル - @yield('title')</h1>
  
          @yield('content')
 
        </main>
    </body>
</html>
・directive/directive.blade.php 
<!-- 共通レイアウトを読み込む。 -->
@extends('layouts.main')
 
<!-- 共通レイアウトへタイトルを表示する。 -->
@section('title', 'タイトル')
  
<!-- 共通レイアウトへコンテンツを表示する。 -->
@section('content')
  <p>コンテンツ</p>
@endsection
@section〜@show, @section
@sectionディレクティブは親ビューでも使用出来ます。
@yieldディレクティブと似ていますが、子ビューから親ビューの内容を使用することが出来ます。
・layouts/main.blade.php 
<html>
    <head></head>
    <body>
        <main>
 
          @section('top')
            <strong>共通で表示したい。</strong>
          @show
 
        </main>
    </body>
</html>
・directive/directive.blade.php 
<!-- 共通レイアウトを読み込む。 -->
@extends('layouts.main')

<!-- 親ビューの内容を表示しつつ、子ビューの内容を表示する。 -->
@section('top')
    <p>下に親ビューの内容が表示される。</p>
    @parent
@endsection
外部ファイル読み込み
@include
@includeディレクティブは外部ファイルを読み込みます。
以下の例は、directive.blade.php から include.blade.php を読み込んでいます。
・layouts/main.blade.php 
<html>
    <head></head>
    <body>
        <main>
          @yield('content')
        </main>
    </body>
</html>
・directive/directive.blade.php 
<!-- 共通レイアウトを読み込む。 -->
@extends('layouts.main')

<!-- 外部ファイルを読み込む -->
@section('content')
  @include('directive.include')
@endsection
・directive/include.blade.php 
<p style='color:#000080'>インクルードされたよ。</p>
まとめ
次回はBladeテンプレート 制御構文超入門を説明します。
© DeNnie.Lab All Rights Reserved.