Laravel 5~嵌套评论的实现
1 / 33 / 创建于 7年前
LaravelChen 的个人博客
经常我们看见评论显示形式有很多，比如'@'某某，又或者像知乎的收缩式的评论，又或者是嵌套式的评论，那么最一开始也是最常见的就是嵌套式评论，因为这个更加醒目.
准备工作
1.设计三张表users,posts,comments，表结构如下:
users
Schema::create('users', function (Blueprint $table) {
$table->increments('id');
$table->string('name');
$table->string('email')->unique();
$table->string('password');
$table->rememberToken();
$table->timestamps();
});posts
Schema::create('posts', function (Blueprint $table) {
$table->increments('id');
$table->string('title');
$table->integer('user_id')->index();
$table->text('content');
$table->timestamps();
});comments
其中parent_id主要表示该评论所属评论的id,如果不属于任何评论则为null
Schema::create('comments', function (Blueprint $table) {
$table->increments('id');
$table->integer('user_id')->index();
$table->integer('post_id')->index();
$table->integer('parent_id')->index()->nullable();
$table->text('body');
$table->timestamps();
});2.表之间的关系如下
Post.php文件
/**
* 一篇文章有多个评论
* @return \Illuminate\Database\Eloquent\Relations\HasMany
*/
public function comments()
{
return $this->hasMany(Comment::class);
}
/**
* 获取这篇文章的评论以parent_id来分组
* @return static
*/
public function getComments()
{
return $this->comments()->with('owner')->get()->groupBy('parent_id');
}Comments.php文件
/**
* 这个评论的所属用户
* @return \Illuminate\Database\Eloquent\Relations\BelongsTo
*/
public function owner()
{
return $this->belongsTo(User::class, 'user_id');
}
/**
* 这个评论的子评论
* @return \Illuminate\Database\Eloquent\Relations\HasMany
*/
public function replies()
{
return $this->hasMany(Comment::class, 'parent_id');
}逻辑编写
我们所要实现的嵌套评论其实在我们准备工作中已经 有点思路了，我们首先将一篇文章显示出来，同时利用文章与评论的一对多关系，进行显示所有的评论，但是我们的评论里面涉及到一个字段就是parent_id，这个字段其实非常的特殊，我们利用这个字段来进行分组, 代码就是上面的return $this->comments()->with('owner')->get()->groupBy('parent_id'),具体的过程如下:
web.php文件
\Auth::loginUsingId(1); //用户id为1的登录
//显示文章和相应的评论
Route::get('/post/show/{post}', function (\App\Post $post) {
$post->load('comments.owner');
$comments = $post->getComments();
$comments['root'] = $comments[''];
unset($comments['']);
return view('posts.show', compact('post', 'comments'));
});
//用户进行评论
Route::post('post/{post}/comments', function (\App\Post $post) {
$post->comments()->create([
'body' => request('body'),
'user_id' => \Auth::id(),
'parent_id' => request('parent_id', null),
]);
return back();
});视图代码
视图方面我们需要实现嵌套，那么随着用户互相评论的越来越多的话，那么嵌套的层级也就越多，所以说，我们这里需要使用各小技巧来显示整个评论，我们使用@include()函数来显示，那么我们试图的结构如下:
-
comments
- comments.blade.php
- form.blade.php
- list.blade.php
-
posts
- show.blade.php
代码如下:
show.blade.phpa
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="//cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container" style="margin-top: 100px">
<div class="col-md-10 col-md-offset-1">
<h2>{{$post->title}}</h2>
<h4>{{$post->content}}</h4>
<hr>
@include('comments.list',['collections'=>$comments['root']])
<h3>留下您的评论</h3>
@include('comments.form',['parentId'=>$post->id])
</div>
</div>
</body>
</html>comment.blade.php
<div class="col-md-12">
<h5><span style="color:#31b0d5">{{$comment->owner->name}}</span>:</h5>
<h5>{{$comment->body}}</h5>
@include('comments.form',['parentId'=>$comment->id])
@if(isset($comments[$comment->id]))
@include('comments.list',['collections'=>$comments[$comment->id]])
@endif
<hr>
</div>form.blade.php
<form method="POST" action="{{url('post/'.$post->id.'/comments')}}" accept-charset="UTF-8">
{{csrf_field()}}
@if(isset($parentId))
<input type="hidden" name="parent_id" value="{{$parentId}}">
@endif
<div class="form-group">
<label for="body" class="control-label">Info:</label>
<textarea id="body" name="body" class="form-control" required="required"></textarea>
</div>
<button type="submit" class="btn btn-success">回复</button>
</form>list.blade.php
@foreach($collections as $comment)
@include('comments.comment',['comment'=>$comment])
@endforeach最后实现的效果图如下:
本作品采用《CC 协议》，转载必须注明作者和本文链接
本帖由 Summer
于 7年前 加精
关于 LearnKu
粤公网安备 44030502004330号
不错，图文并茂！
@Corwien thank you
不错不错 学习学习
@Ysll 交流交流哈哈
这个我在laracasts 看过
How系列
希望出个 @ 功能的实现，比起嵌套更喜欢这种
@Payne 嗯嗯!
谢谢！
@carlclone 这和多少评论没有什么关系，只要是有父评论，都可以嵌套，至于互相回复的次数过多的情况，造成界面上面不打美观，其实解决办法也很简单，你可以判断当前的嵌套层数，然后超过你设定的层数，就不再缩进显示了，那么就可以了!
不错
show.blade.php 里边这个 @include('comments.form',['parentId'=>$post->id]) 不应该加,['parentId'=>$post->id]吧！
@chenxin 还有，所有没有评论的页面错误：Undefined index:
@李兮没有评论的话你用@if进行判断，比如
@chenxin 如何处理分页呢？
中间某一层的评论删了呢。。
@Specs 你既然已经删掉中间的，那么你直接它的子评论也删了呗。。。。。。。
@chenxin 中间某层用户自己删掉了自己的，那把别人在下面的回复也都删了也不好。。
@Specs 诶！你既然父评论都没了，留着子评论干哈！表示和谁在说话?
@chenxin @Specs use SoftDelete，“该评论已删除”。
@springjk
@Specs 用软删除蛮好的，我一般直接在model里面（下面这个好比一个帖子删除了，顺带删除其相应的评论和通知）
安装好打开首页就出现这个我看了PostsController文件有的
这是什么情况？
@jameszhu 你自己看看PostsController额拼写。。。
@LaravelChen 看到了，把routes/web.php里的COntroller改回来了，然后刷新网页一片空白
@jameszhu 命名空间加了没，其实出现这些问题都是基础性的东西，
@LaravelChen 不知道哪里加
:convenience_store:
:joy:
求大神帮忙看一下为什么这样啊。搞了一个晚上没搞明白。全程按大神要求做的，环境valet.
@springjk niu 牛
@springjk :kissing_heart:
感谢 :grin:
评论的图片和视频直接放到 body 里面吗？
如何根据时间进行排序呢，