てくてくあるく

WordPress の テーマ とか プラグイン に ついて 勉強しています

前回は DBを作成して テストデータを 入れたので
今回は 前々回追加した インデックスページに 前回追加した テストデータを 一覧表示させていきたいと思います

流れとしては コントローラ ( app / Http / Controllers / LinkController.php ) で モデル ( \App\Models\Link ) にある データを すべて取得して ビュー ( resources / views / links / index.blade.php ) に渡して 表示します


コントローラの編集


という訳で コントローラ内の public function index() の 中身を書き換えます

    public function index()
    {
        $links = \App\Models\Link::all();
        return view('links.index', ['links' => $links]);
    }

ビューの編集


次に ビュー を

@extends('links.default')

@section('title', 'links.index')

@section('style')
      .links dd {
        margin-left: 2rem;
        word-break: break-all;
      }
@endsection

@section('content')
      <section class="my-3 links">
        <header>
          <h2 class="text-center">@yield('title')</h2>
        </header>
        <dl>
          @foreach ($links as $link)
            <dt><a href="{{ $link->url }}">{{ $link->title }}</a></dt>
            <dd>{{ $link->description }}</dd>
          @endforeach
        </dl>
      </section>
@endsection

の 様に 書き換えます

増えたのは 5〜10行目 と 17〜22行目です

5〜10行目 は スタイルを整えるための記述です

重要なのは 17〜22行目 に なります

Bladeテンプレート では @foreach@endforeach で 配列の反復処理をする事が出来て {{ 〜 }} で 文字列の表示が出来ます


ページの確認


http://localhost:50000/links/ で 確認します

リンク一覧が 表示されていれば インデックスページの 完成です

Related Article

[ はじめて の Laravel ] リンク一覧ページ を 作る No.4

詳細へ »

[ はじめて の Laravel ] リンク一覧ページ を 作る No.4.5 – フォームリクエスト の バリデーション で 躓いた 小話

詳細へ »

[ はじめて の Laravel ] リンク一覧ページ を 作る No.2

詳細へ »