Laravelでforeachを使って一覧を表示する方法
いつもご利用ありがとうございます。
この記事には広告が掲載されており、その広告費によって運営しています。
Laravel で foreach を使って一覧を表示する方法についてまとめました。
foreach を使う方法
.blade.php ファイルで
<div>
<ol>
@foreach($users as $user)
<li>{{ $user->name }}</li>
@endforeach
</ol>
</div>と書きます。
@foreach と@endforeach の間にある
<li>{{ $user->name }}</li>の部分が、$users の数だけ生成されます。
好きな情報を users の数だけ表示できる
@foreachと@endforeachの間に色々書くと、その部分が$users の数だけ生成されます。
<div>
@foreach($users as $user)
<div>
<p>ユーザーの名前は、{{ $user->name }}さんです</p>
<p>IDは、{{ $user->id }}です</p>
<img src="{{ $user->logo_url }}" alt="" />
</div>
@endforeach
</div>このように複数タグ使っても大丈夫で、@foreach から@endforeach の間を users の数だけ表示してくれるというルールさえ分かっていれば、かなり自由にコードを書くことが可能です。
もちろんタグにクラスをつけて、CSS を当てることも可能です。
注意点
blade ファイルでしか使えない
例えば、出力結果がそのまま
@foreach($users as $user)
@endforeachと表示されたとします。
その時は、ファイル名をミスっている可能性があります。
誤り：home.php
正解：home.blade.php
年に２回くらいやるミスです。
閉じタグをミスると悲惨
div タグの閉じタグミス
<div>
@foreach($users as $user)
<div>
<p>ユーザーの名前は、{{ $user->name }}さんです</p>
<p>IDは、{{ $user->id }}です</p>
<img src="{{ $user->logo_url }}" alt="" />
@endforeach
</div></div>が$usersの数だけ足りなくなるので大変なレイアウト崩壊を起こしま す。
a タグの閉じタグミス（悲惨）
ちなみに<a>タグの閉じタグミスはかなり厄介で、勝手に閉じタグがブラウザ上で補完されて出力されます。
表示上違和感がなかったりするけど、余白とかホバーとか変な気がするけど原因分からない、という状態になりました。
@foreach($array as $a)
<div>
<a href="/">ホーム
</div>
@endforeach出力：
<div><a href="/">ホーム</a></div>
<a href="/"></a>
<div><a href="/"></a><a href="/">ホーム</a></div>
<a href="/"></a>
<div><a href="/"></a><a href="/">ホーム</a></div>
<a href="/"></a>記述が少なければすぐに気づくのですが、実際は色々なタグをforeachで回すことは多々あると思います。
ミスをしないようにインデントは綺麗に整えたり、プラグインの整形機能を使った方が良いですね。
まとめ
Laravel の Blade ファイルで foreach を使う方法について簡潔にまとめてみました。
注意点含め、誰かの参考になれば幸いでございます。
今回の内容は、この辺りに書いてあります。
