過去バージョン

この本文には実行可能なタグ等が含まれるため、安全のためHTMLソースとして表示しています。本文データは変更していません。

<table border="1" cellpadding="1" cellspacing="1" style="width:1000px">
	<thead>
		<tr><th style="background-color:#f39c12;color:#ffffff;text-align:left">この記事の要点</th></tr>
	</thead>
	<tbody>
		<tr>
			<td style="background-color:#fef9e7">
			<ul>
				<li>Laravel Blade の<strong>親ビュー / 子ビュー（テンプレート継承）</strong></li>
				<li>親側: <code>@section / @yield</code> で<strong>差し込み枠</strong>を定義</li>
				<li>子側: <code>@extends('親')</code> + <code>@section('name') ... @endsection</code></li>
				<li>部分テンプレ取込: <code>@include('partial')</code> / 親内容呼び出し: <code>@parent</code></li>
			</ul>
			</td>
		</tr>
	</tbody>
</table>

<p>&nbsp;</p>



<p><span style="font-size:14px"><strong>Laravelの親ビュー、子ビュー</strong>に関する記事です。</span></p>

<p>&nbsp;</p>

<h2><span style="font-size:16px">テンプレートとなる親ビューの作成</span></h2>

<p>viewsディレクトリ内に任意ディレクトリを作り、</p>

<p><span style="font-size:14px">その中にXXX.blade.phpというファイルを配置する。</span></p>

<p><span style="font-size:14px">※ファイルの拡張子をXXX.blade.phpとする。</span></p>

<p>&nbsp;</p>

<p><span style="font-size:14px"><strong>resources/views/任意ディレクトリ/XXX.blade.php</strong></span></p>

<table border="1" cellpadding="1" cellspacing="1" style="width:500px">
	<tbody>
		<tr>
			<td style="background-color:#eeeeee">
			<p><strong><span style="font-size:14px"><!doctype html></span></strong></p>

			<p><strong><span style="font-size:14px"><html ></span></strong></p>

			<p><strong><span style="font-size:14px"><head></span></strong></p>

			<p><strong><span style="font-size:14px">&nbsp;&nbsp;&nbsp;&nbsp;<meta charset="UTF-8"></span></strong></p>

			<p><strong><span style="font-size:14px">&nbsp;&nbsp;&nbsp;&nbsp;<title>&nbsp;@yield('title')</title></span></strong></p>

			<p><strong><span style="font-size:14px"></head></span></strong></p>

			<p><strong><span style="font-size:14px"><body></span></strong></p>

			<p><strong><span style="font-size:14px">&nbsp; &nbsp;<span style="color:#27ae60">&nbsp;@section</span>('sidebar') </span></strong></p>

			<p><strong><span style="font-size:14px">&nbsp; &nbsp; &nbsp; &nbsp; サイドバー </span></strong></p>

			<p><strong><span style="font-size:14px">&nbsp; &nbsp; @show</span></strong></p>

			<p><strong><span style="font-size:14px">&nbsp;&nbsp;<span style="color:#2980b9">&nbsp;&nbsp;@yield</span>('content');</span></strong></p>

			<p><strong><span style="font-size:14px"></body></span></strong></p>

			<p><strong><span style="font-size:14px"></html></span></strong></p>
			</td>
		</tr>
	</tbody>
</table>

<p><span style="font-size:14px"><strong><span style="color:#16a085">@section</span></strong>ディレクティブはコンテンツのセクションを定義する。</span></p>

<p><span style="font-size:14px"><strong><span style="color:#2980b9">@yield</span></strong>ディレクティブは指定したセションの内容を表示するために使用する。</span></p>

<p>&nbsp;</p>

<h2><span style="font-size:16px">子ビューの作成</span></h2>

<p><span style="font-size:14px">子ビューを定義するには、<span style="color:#c0392b"><strong>Blade&nbsp;@extends</strong></span>ディレクティブを使用する。</span></p>

<p><span style="font-size:14px">Bladeレイアウトを拡張するビューは、<span style="color:#27ae60"><strong>@section</strong></span>ディレクティブを使用し、レイアウトのセクションに内容を挿入。</span></p>

<p><span style="font-size:14px">レイアウトでセクションを表示するには<strong><span style="color:#2980b9">@yield</span></strong>を使用する。</span></p>

<p>&nbsp;</p>

<p><span style="font-size:14px"><strong>resources/views/XXX.blade.php</strong></span></p>

<table border="1" cellpadding="1" cellspacing="1" style="width:500px">
	<tbody>
		<tr>
			<td style="background-color:#eeeeee">
			<p><strong><span style="font-size:14px"><span style="color:#c0392b">@extends</span>('</span><em><span style="font-size:14px">親ビューを配置したディレクトリ</span></em><span style="font-size:14px">.app') </span></strong></p>

			<p><strong><span style="font-size:14px"><span style="color:#27ae60">@section</span>('title', 'Page Title') </span></strong></p>

			<p><strong><span style="font-size:14px"><span style="color:#27ae60">@section</span>('sidebar') </span></strong></p>

			<p><strong><span style="font-size:14px">　<span style="color:#8e44ad">@parent </span></span></strong></p>

			<p><strong><span style="font-size:14px">　<p>サイドバーに追加</p> </span></strong></p>

			<p><strong><span style="font-size:14px">@endsection </span></strong></p>

			<p><strong><span style="font-size:14px"><span style="color:#27ae60">@section</span>('content')</span></strong></p>

			<p><strong><span style="font-size:14px">　<p>本文のコンテンツ</p></span></strong></p>

			<p><strong><span style="font-size:14px">@endsection</span></strong></p>
			</td>
		</tr>
	</tbody>
</table>

<p><span style="font-size:14px"><u>sidebarセクション</u>では、レイアウトのサイドバーの内容をコンテンツに上書きするのではなく、</span></p>

<p><span style="font-size:14px">追加するために<span style="color:#8e44ad"><strong>@parent</strong></span>ディレクティブを使用。</span></p>

<p><span style="font-size:14px"><strong><span style="color:#8e44ad">@parent</span></strong>ディレクティブはビューをレンダーするときに、レイアウトの内容に置き変わる。</span></p>

<p>&nbsp;</p>

<p><span style="color:#e74c3c"><strong>@include</strong></span>を使用することで個別にビューを読み込むことが出来る。</p>

<table border="1" cellpadding="1" cellspacing="1" style="width:500px">
	<tbody>
		<tr>
			<td style="background-color:#eeeeee">
			<p><strong><span style="font-size:14px"><span style="color:#c0392b">@include</span>('<em>個別のビュー</em></span><span style="font-size:14px">') </span></strong></p>
			</td>
		</tr>
	</tbody>
</table>