【Laravel】Viewのディレクティブ機能 @extends、@section、@yield

ビューの継承
ビューの作成には、親の持っている機能を子が使う「継承」が使われる。
以下、公式ドキュメントより一部抜粋。
 
Bladeを使用する主な利点は、テンプレートの継承とセクションです。
 
ご覧の通り、典型的なHTMLマークアップで構成されたファイルです。しかし、@sectionや@yieldディレクティブに注目です。@sectionディレクティブは名前が示す通りにコンテンツのセクションを定義し、一方の@yieldディレクティブは指定したセッションの内容を表示するために使用します。
 
子のビューを定義するには、「継承」するレイアウトを指定する、Blade @extendsディレクティブを使用します。Bladeレイアウトを拡張するビューは、@sectionディレクティブを使用し、レイアウトのセクションに内容を挿入します。前例にあるようにレイアウトでセクションを表示するには@yieldを使用します。
 
 
流れのイメージ
  • 各ページの共通レイアウトを親ビューとして、異なる部分だけを子ビューとして作成したい。
  • 子ビューで親ビューを継承するよと宣言すれば、親ビューの持っているレイアウトが反映される。
  • 子ビューには、親ビューの中で使いたい自分固有のパーツを書く。
  • 親ビューでは、各子ビュー固有のパーツをどこで反映させるのかを書いておく。
  • これで各ページにアクセスがあれば、親ビューをベースとした各子ビュー固有の画面が表示される。
 
 

*親ビューですること

  • @yieldで各子ビュー固有のパーツをどこで反映させるのかを記述する。

*子ビューですること

  • @extendsで今から親ビューを継承するよと宣言する。
  • @sectionで自分固有のパーツを定義する。
 
 
試してみる
例として、welcome.blade.phpというデフォルトでトップページに設定されているファイルを、親ビューと子ビューに分けてみる。
 
実際に表示されるのは子ビューなので、これをwelcome.blade.phpとする。
親ビューはresources/views/commonディレクトリの中に、layout.blade.phpを作成する。
 
まずはwelcome.blade.phpの内容を全てlayout.blade.phpにコピーし、親ビューの土台を作る。
 
そしてwelcome.blade.phpの記述を、下記の内容のみにする。
welcome.blade.php
 
@extends('common.layout')  //commonディレクトリのlayout.blade.phpを親ビューとして継承する。
 
@section('child') //welcome.blade.php固有のパーツをchildという名前で定義する。
<p>表示する内容<p>
@endsection //セクションの定義を終了する。
 
次にlayout.blade.phpでは、子ビューで定義した @section<p>表示したい内容<p> を表示したい位置に、以下の通り記述する。@yield('child')を記述した場所に@section('child')の内容がそのまま反映される。
layout.blade.php
 
@yield('child')
 
以上の記述により、welcome.blade.php(子ビュー)にアクセスされた時、layout.blade.php(親ビュー)をベースとしたレイアウトにwelcome.blade.php固有のパーツが組み込まれて表示される。