⑦ Laravelで簡単なCRUDシステムを作る（Show…データ詳細を見る）

2021-06-272023-02-20

ルーティングを設定

web.phpに、下記のように一行追記しましょう。今回は、どの情報を表示するか、をidで識別するので、show/{id}となる点に注意してください。

<?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\TodoController;

// Route::get('/', function () {
//     return view('welcome');
// });

Route::get('todo/index', [TodoController::class, 'index'])->name('todo.index');
Route::get('todo/create', [TodoController::class, 'create'])->name('todo.create');
Route::post('todo/store', [TodoController::class, 'store'])->name('todo.store');
Route::get('todo/show/{id}', [TodoController::class, 'show'])->name('todo.show'); //追記

コントローラの設定

コントローラのshowのところに下記のように追記します。

    public function show($id)
    {
        $todo = Todo::find($id); //追記 モデルから一つだけデータを持ってきて変数に入れる
        return view('todo.show', compact('$todo')); //追記
    }

ビューを設定

show.blade.phpというファイルをつくり、下記のように書き、詳細が表示されるようにします。

<div class="container-sm">
  <link href="{{ asset('css/app.css') }}" rel="stylesheet">
  <h1>showです</h1>

  ID：{{ $todo->id }} <br>
  内容：{{ $todo->content }} <br>
  対応したかどうか：{{ $todo->done }} <br>
  作成日時：{{ $todo->created_at }} <br>
  更新日時：{{ $todo->udpated_at }} <br>

</div>

一覧画面から詳細画面へのリンクを作る

index.blade.phpからshow.blade.phpにリンクさせるために、indexファイルに下記のような追記をする。

<div class="container-sm">
  <link href="{{ asset('css/app.css') }}" rel="stylesheet">
  <h1>indexです</h1>
  <pre>ここにtodo一覧が表示されます</pre>

  <form method="GET" action="{{ route('todo.create') }}">
  <button type="submit" class="btn btn-primary">新規登録</button>
  </form>

  <table class="table">
    <thead>
      <tr>
        <th scope="col">id</th>
        <th scope="col">内容</th>
        <th scope="col">対応済みかどうか</th>
      </tr>
    </thead>
    <tbody>
      @foreach($todos as $todo)
      <tr>
        <th>{{ $todo->id }}</th>
        <td>{{ $todo->content }}</td>
        <td>{{ $todo->done }}</td>
        <td><a href="{{ route('todo.show', [ 'id'=>$todo->id ] ) }}">詳細をみる</a></td> //追記
      </tr>
      @endforeach
    </tbody>
  </table>
</div>

これで、下記のような画面が表示されて無事にリンクしていれば成功です。