いいね状態 と 非いいね状態 の表示制御がうまくいきません。
解決したいこと
いいね状態 と 非いいね状態 の表示制御がうまくいってないので解決したい。
laravelでツイッターのようなアプリをつくっています。
https://qiita.com/phper_sugiyama/items/9a4088d1ca816a7e3f29
上記の記事を参考にいいね機能を作成しているのですが、「いいね」を押しても、ボタンの色が変わらず、無限にいいねを押し続けてしまっています。
理想としては、一度「いいね」を押したら、ボタンの色が緑色に変化し、もう一度押すと、いいねが取り消されて、元のグレーにボタンの色が戻る仕様にすることです。
blade.php
$likeは参考記事では $reply->is_liked_by_auth_user() となっており、コントローラーでインスタンス化してblade.phpに$likeという形で渡しています。
@if( $like )
<a href="{{ route('unlike', ['id' => $record->id]) }}" class="btn btn-danger opacity-75 btn-sm">
<i class="fa fa-heart" aria-hidden="true"></i>
<span class="badge">済</span></a>
@else
<a href="{{ route('like', ['id' => $record->id]) }}" class="btn btn-secondary btn-sm">
<i class="fa fa-heart" aria-hidden="true"></i>
<span class="badge">未</span></a>
@endif
以下、Recordモデルです。（記事中ではReplyモデルとなっています。）
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
use App\Models\Like;
class Record extends Model
{
use HasFactory;
public function user() {
return $this->belongsTo('App\Models\User');
}
public function likes()
{
return $this->hasMany(Like::class, 'record_id');
}
/**
* リプライにLIKEを付いているかの判定
*
* @return bool true:Likeがついてる false:Likeがついてない
*/
public function is_liked_by_auth_user()
{
$id = \Auth::id();
$likers = array();
foreach($this->likes as $like) {
//array_pushは配列に値を追加する。第一引数に追加する配列、第二引数に追加する値
array_push($likers, $like->user_id);
}
//in_array 第一引数に検索する値、第二引数に配列
if (in_array($id, $likers)) {
return true;
} else {
return false;
}
}
}
以下、実装中のいいねボタンです。
ボタンを押すとDBに登録されます。
+----+-----------+---------+---------------------+---------------------+
| id | record_id | user_id | created_at | updated_at |
+----+-----------+---------+---------------------+---------------------+
| 38 | 6 | 3 | 2022-03-13 16:09:44 | 2022-03-13 16:09:44 |
+----+-----------+---------+---------------------+---------------------+
しかし、if文内の判定がうまくされないのか、bladeが切り替わらず、無限いいねをしてしまいます。
自分で試したこと
Recordモデルのif文の判定がうまくできていないのではと思い、いろいろいじってみたのですが、解決しませんでした。
また、キャッシュの削除もしてみましたが、解決しませんでした。
何か助言をいただけると幸いです。よろしくお願いいたします。
0
