Laravelの@eachディレクティブで簡単に繰り返しテンプレートを表示する方法
生徒
「Laravelでリストを繰り返して表示するとき、コードが長くなりませんか?」
先生
「そうですね。LaravelのBladeには便利な@eachディレクティブがあって、繰り返し表示を簡単にできますよ。」
生徒
「@eachってどんな風に使うんですか?」
先生
「それでは、@eachの使い方をわかりやすく説明しますね!」
1. @eachディレクティブとは?
Laravelの@eachディレクティブは、配列やコレクションの中身を繰り返し処理して、決まった部分テンプレートを何度も呼び出す便利な機能です。
例えば、商品の一覧やコメントリストなど、同じ構造のデータを繰り返し表示したいときに使います。
Bladeの@foreachでも繰り返しはできますが、@eachを使うとさらにシンプルに書けて、見た目もスッキリします。
2. @eachの基本構文
書き方は下記のように、3つの引数を指定します。
@each('部分テンプレート名', $配列やコレクション, '変数名', '空のとき表示するビュー')
- 部分テンプレート名:繰り返し表示するHTMLを作るBladeファイルの名前(例:
items.item) - $配列やコレクション:繰り返したいデータのリスト(例:
$items) - 変数名:部分テンプレートで使う変数の名前(例:
item) - 空のとき表示するビュー:もしデータが空だった場合に表示するBladeファイル(省略も可能)
3. 具体例で見る@eachの使い方
例えば、商品リストを繰り返して表示する場合を考えます。
① 部分テンプレート(resources/views/items/item.blade.php)を作成します。ここで一つの商品を表示します。
<div class="item">
<h3>{{ $item->name }}</h3>
<p>価格: ¥{{ number_format($item->price) }}</p>
</div>
② メインのBladeファイルで、@eachを使って商品リストを表示します。
@each('items.item', $items, 'item', 'items.empty')
ここで、$itemsは商品データの配列やコレクション、itemは部分テンプレート内で使う変数名、items.emptyは商品が一つもない時に表示するビューです。
③ 空の時に表示するビュー(resources/views/items/empty.blade.php)を作ります。
<p>商品はまだ登録されていません。</p>
4. @eachと@foreachの違い
@foreachは繰り返し処理の基本で、ループ内に好きなコードを書けます。
@eachは「決まった部分テンプレートを繰り返す」ことに特化していて、コードが短く、シンプルになるのが特徴です。
小さいパーツを何度も表示するときは@eachを使うと効率的です。
5. @eachのメリットと注意点
メリットはコードがシンプルになり、メンテナンスがしやすいことです。部分テンプレートを別ファイルにまとめるため、HTMLの見通しもよくなります。
注意点としては、複雑な条件分岐が必要なときや、ループ中に細かい処理を入れたい場合は@foreachのほうが向いています。
また、空の場合のビューを省略すると、何も表示されなくなるので必要に応じて空ビューも用意しましょう。
6. 実際のコード例
{{-- 部分テンプレート resources/views/items/item.blade.php --}}
<div class="item">
<h3>{{ $item->name }}</h3>
<p>価格: ¥{{ number_format($item->price) }}</p>
</div>
{{-- メインテンプレートでの呼び出し --}}
@each('items.item', $items, 'item', 'items.empty')
{{-- 空の時のビュー resources/views/items/empty.blade.php --}}
<p>商品はまだ登録されていません。</p>
まとめ
LaravelのBladeテンプレートで利用できる@eachディレクティブは、繰り返し処理をより簡潔な形で記述できる便利な仕組みであり、複数のデータを扱う画面構築において大きな役割を果たします。とくに商品一覧やコメントリストのように同じ構造を何度も表示する場面では、ひとつひとつの表示ロジックを部分テンプレートとして切り出しておくことで、コード全体の見通しが良くなり、修正や追加も容易になります。Bladeの書き方は直感的で理解しやすいため、テンプレートファイルを分けて管理する手法はプロジェクトの規模が大きくなるほど価値を発揮し、構造が明確になることで保守性も飛躍的に高まります。ビュー構築の段階で整ったパーツを用意しておけば、開発中に同じHTMLを繰り返し記述する必要がなくなり、誤記や記述揺れも防げます。同時に、空データ用のビューを設定しておくことで「何も表示されない画面」にならず、利用者にとって情報の欠落を避ける工夫にも繋がります。テンプレートの明確な分離はメンバー間での共有もしやすくなり、どの部分がどのデータを扱うのかが明確になっていくため、学習段階でも理解を深めやすい構造です。Bladeの@eachは、軽快で扱いやすいビュー構築を支える基礎的な機能でありながら、実用性の高い場面が多い点でも注目すべき存在です。実際の画面制作やデータ一覧表示では多くのパターンに応用でき、初心者でも読みやすく編集しやすいテンプレート構造を実現できるようになります。
サンプルプログラム(振り返り用)
ここでは商品リストを表示する場面を基準に、@eachを利用した基本的な構成を振り返ります。
{{-- resources/views/items/card.blade.php --}}
<div class="item-card">
<h4>{{ $item->title }}</h4>
<p>説明文:{{ $item->description }}</p>
<span>在庫:{{ $item->stock }}個</span>
</div>
{{-- メインテンプレートでの呼び出し --}}
@each('items.card', $items, 'item', 'items.none')
{{-- 空の場合のビュー resources/views/items/none.blade.php --}}
<p>現在表示できる商品はありません。</p>
部分テンプレートにまとめておくことで構造が明確になり、ひとつひとつを違うページでも再利用できる利点があります。価格、在庫、説明文などの要素を整理しつつ見やすく表示する上でも、テンプレート分割は非常に有効です。
生徒
「@eachって最初は難しそうに感じましたけど、使ってみるとすごくスッキリ書けるんですね!」
先生
「そうですね。繰り返し表示のテンプレートを分割できるので、ビューの可読性も上がりますし、後から別の画面でも再利用しやすいんですよ。」
生徒
「部分テンプレートを増やして管理すれば、アプリ全体の画面構成も整理できますね。空のときのビューが設定できるのも便利だと思いました。」
先生
「その通りです。空のリストに対して適切なメッセージを出すことで、利用者に不安を与えない画面設計になります。小さな工夫ですが大切ですよ。」
生徒
「@foreachとの使い分けも理解できました。細かい処理が必要なときは@foreach、パーツを繰り返すだけなら@each、って感じですね。」
先生
「ええ、その判断ができるようになると画面構築がとても楽になります。目的に合った書き方を選ぶことが効率のよい開発へと繋がりますよ。」
生徒
「これからのLaravel開発でも積極的に使ってみます!繰り返し表示が多いページで活かせそうです。」
先生
「その意識はとても良いですね。Bladeの特徴を理解していくことで、より柔軟で構造の整ったビューが作れるようになりますよ。」