Laravelでインスタグラムのようなモノを作ってみる-3
I wrote: 2017/09/24
Laravelで作るインスタグラムのようなモノ3回目です。今回はコメントできるように実装します。
1.こんな感じのコメントフォームを作成する
show.blade.php
フォームを使う場合は{{ csrf_field() }}は必須なので忘れずに。
@extends ('layouts.master')
@section ('content')
<div class="row">
<!-- 写真とキャプションを表示 -->
<div class="card">
<img src="/image/image-{{ $post->id }}.png" alt="Card image cap">
<p class="card-text">{{ $post->caption }}</p>
</div>
</div>
<!-- コメントフォーム -->
<form method="POST" action="/{{ $post->id }}/comment">
{{ csrf_field() }}
<div class="form-group">
<input type="text" class="form-control" id="comment" name="comment" placeholder="コメント">
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">コメントする</button>
</div>
</form>
<!-- コメントを表示 -->
<div class="comments">
<ul class="list-group">
@foreach ($post->comments as $comment)
<li class="list-group-item">{{ $comment->comment }}</li>
@endforeach
</ul>
</div>
@endsection
web.php
コメントするボタンがクリックされると、例えば /1/commentにPOSTが行われるので、次を加える。
Route::post('/{post}/comment', 'CommentsController@store');
2.コメントロジックを実装する
Post.php
createメソッドを使って入力したコメントをインサートします。
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Post extends Model
{
public function comments()
{
// ポストに紐づくコメントを取得
return $this->hasMany(Comment::class);
}
public function addComment($comment)
{
// 新しいレコードを作成
// 新しいレコードを作成
Comment::create([
'comment' => $comment,
'post_id' => $this->id
]);
}
}
Comment.php
createメソッドを使う場合は、モデルに$fillableか$guardedを設定する必要があります。
$guardedはブラックリスト機能です。
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Comment extends Model
{
// この場合はpost_idとcommentのみ挿入OK。 ホワイトリスト機能。
// この場合はpost_idとcommentのみ挿入OK。 ホワイトリスト機能。
protected $fillable = ['post_id','comment'];
}
CommentsController.php
入力されたコメントをバリデート処理して、commentsテーブルへコメントを保存。
<?php
namespace App\Http\Controllers;
use App\Post;
class CommentsController extends Controller
{
public function store(Post $post)
{
// バリデーションチェック
// この場合、コメントは「入力必須、最大100」という入力値チェックになる
// この場合、コメントは「入力必須、最大100」という入力値チェックになる
$this->validate(request(), [
'comment' => 'required | max:100'
]);
$post->addComment(request('comment'));
// createメソッドを使わない場合はこういう書き方も可能
// $comment = new Comment;
// $comment->comment = request('comment');
// $comment->save();
// createメソッドを使わない場合はこういう書き方も可能
// $comment = new Comment;
// $comment->comment = request('comment');
// $comment->save();
return back();
}
}
これでロジック実装が完了!
実際にコメントしてみるとこうなる。
これでインスタグラムのようなモノの完成です。クオリティは低いですが(´・ω・`)
Laravelは慣れると便利ですね!