0

0

在 Laravel 中实现文章评论及回复的层级展示

聖光之護

聖光之護

发布时间:2025-09-24 11:45:20

|

296人浏览过

|

来源于php中文网

原创

在 Laravel 中实现文章评论及回复的层级展示

本教程详细阐述如何在 Laravel 应用中构建一个高效的评论与回复系统。通过定义 Eloquent 模型间的自引用 hasMany 关系,并结合预加载技术,我们能够一次性查询并层级化展示文章下的所有顶级评论及其回复。这不仅优化了数据库查询效率,也使得前端模板的渲染逻辑更加清晰和易于维护,有效避免了N+1查询问题。

1. 数据库结构设计

为了支持评论及其回复功能,我们需要一个能够自引用的评论表。以下是 article_comments 表的推荐结构,其中 comment_id 字段是实现回复功能的核心:

Schema::create('article_comments', function (Blueprint $table) {
   $table->bigIncrements('id');
   $table->unsignedBigInteger('article_id');
   $table->foreign('article_id')
         ->references('id')->on('articles')->onDelete('cascade');
   $table->string('name');
   $table->string('email');
   $table->text('text');
   $table->string('date'); // 建议使用 $table->timestamp('posted_at'); 或直接依赖 $table->timestamps()

   // comment_id 字段用于自引用,指向父评论的ID
   $table->unsignedBigInteger('comment_id')->nullable();
   $table->foreign('comment_id')
         ->references('id')->on('article_comments')->onDelete('set null'); // 父评论删除时,子评论的comment_id设为null

   $table->timestamps(); // Laravel 默认的 created_at 和 updated_at
});

在这个设计中:

  • article_id 关联到文章表,表示评论属于哪篇文章。
  • comment_id 是一个可空的 unsignedBigInteger 字段,它指向 article_comments 表自身的 id。如果 comment_id 为 null,则表示这是一条顶级评论;如果 comment_id 有值,则表示它是对 comment_id 所指向评论的回复。

2. Eloquent 模型关系定义

为了在 Laravel 中方便地操作评论及其回复,我们需要在 Article 和 ArticleComment 模型中定义相应的 Eloquent 关系。

2.1 ArticleComment 模型中的回复关系

app/Models/ArticleComment.php 模型中,定义一个自引用关系 answers 来获取当前评论的所有回复:

// app/Models/ArticleComment.php
hasMany(ArticleComment::class, 'comment_id', 'id');
    }

    // 可选:定义与所属文章的关系
    public function article()
    {
        return $this->belongsTo(Article::class);
    }

    // 可选:定义与父评论的关系
    public function parentComment()
    {
        return $this->belongsTo(ArticleComment::class, 'comment_id', 'id');
    }
}

这里,answers() 方法使用 hasMany 关系,将 article_comments 表的 comment_id 字段与当前评论的 id 字段关联起来,从而获取所有直接回复当前评论的子评论。

2.2 Article 模型中的评论关系

在 app/Models/Article.php 模型中,定义一个 comments 关系来获取文章下的所有评论:

// app/Models/Article.php
hasMany(ArticleComment::class, 'article_id', 'id');
    }
}

3. 数据查询与加载

为了高效地获取文章及其所有顶级评论和对应的回复,我们应该利用 Eloquent 的预加载(Eager Loading)功能。这可以避免 N+1 查询问题,显著提升性能。

以下查询示例展示如何获取 ID 为 1 的文章,并预加载其所有顶级评论以及这些评论的回复:

use App\Models\Article;

$article = Article::where('id', 1)->with(['comments' => function($query) {
    // 筛选出顶级评论 (comment_id 为 null)
    $query->whereNull('comment_id')->with('answers');
}])->first();

// 如果需要获取所有评论(包括顶级和回复),并以层级结构呈现,上述方法是首选。
// 如果 $article 是一个集合,使用 get() 而不是 first()
// $articles = Article::with(['comments' => function($q) {
//             $q->whereNull('comment_id')->with('answers');
//         }])->get();

通过上述查询,$article 对象将包含一个 comments 集合,其中每个评论对象又可能包含一个 answers 集合。这种结构非常适合在前端进行层级展示。

Magician
Magician

Figma插件,AI生成图标、图片和UX文案

下载

查询结果示例(JSON 格式):

{
  "id": 1,
  "title": "示例文章标题",
  "content": "这是文章内容...",
  "comments": [
    {
      "id": 1,
      "article_id": 1,
      "name": "用户A",
      "text": "这是一条顶级评论。",
      "comment_id": null,
      "answers": [
        {
          "id": 5,
          "article_id": 1,
          "name": "用户B",
          "text": "这是对评论1的回复1。",
          "comment_id": 1
        },
        {
          "id": 6,
          "article_id": 1,
          "name": "用户C",
          "text": "这是对评论1的回复2。",
          "comment_id": 1
        }
      ]
    },
    {
      "id": 2,
      "article_id": 1,
      "name": "用户D",
      "text": "这是另一条顶级评论。",
      "comment_id": null,
      "answers": [] // 没有回复的评论,answers 集合为空
    }
  ]
}

4. Blade 模板中的展示

在 Blade 模板中,我们可以遍历获取到的评论数据,并根据其是否包含 answers 来渲染不同层级的样式。



评论

@if($article && $article->comments->isNotEmpty())
@foreach($article->comments as $comment) {{-- 顶级评论 --}}
{{ $comment->name }}
{{ date('d F Y', strtotime($comment->date)) }}
{{ $comment->text }}
{{-- 评论的回复 --}} @if($comment->answers->isNotEmpty())
@foreach($comment->answers as $reply)
{{ $reply->name }}
{{ date('d F Y', strtotime($reply->date)) }}
{{ $reply->text }}
@endforeach
@endif
@endforeach
@else

暂无评论。

@endif

在这个 Blade 模板中:

  • 我们首先遍历 $article->comments 集合,这会渲染所有顶级评论。
  • 在每个顶级评论内部,我们检查 $comment->answers 集合是否为空。如果非空,则再次遍历 answers 集合,渲染回复内容。
  • 通过使用不同的 CSS 类 (comment-list__item 和 comment-sub-list__item),可以轻松地为顶级评论和回复应用不同的样式,实现视觉上的层级区分。

5. 独立查询回复的场景

在某些特定场景下,你可能需要单独查询某个评论的所有回复,或者某个评论及其所有回复,而不是通过文章一次性加载。

5.1 仅查询某个评论的所有回复

use App\Models\ArticleComment;

$parentCommentId = 1; // 假设要查询 ID 为 1 的评论的所有回复
$replies = ArticleComment::where('comment_id', $parentCommentId)->get();

// $replies 将包含所有直接回复 ID 为 1 的评论的子评论

5.2 查询某个评论及其所有回复

use App\Models\ArticleComment;

$commentId = 1; // 假设要查询 ID 为 1 的评论及其回复
$commentWithReplies = ArticleComment::where('id', $commentId)->with('answers')->first();

// $commentWithReplies 将包含 ID 为 1 的评论对象,其 answers 属性中包含所有直接回复

6. 注意事项与最佳实践

  • N+1 查询问题:务必使用 with() 方法进行预加载。如果直接在循环中访问关系(例如在 @foreach 中每次都去查询 $comment->answers 而不预加载),会导致大量的数据库查询,严重影响性能。
  • 多级回复:当前方案支持一级回复(即顶级评论下的直接回复)。如果需要实现无限级回复,需要更复杂的递归关系定义和前端渲染逻辑,通常会使用递归视图组件或额外的包来处理。
  • 数据验证:在接收用户提交的评论和回复时,务必进行严格的数据验证,确保数据的完整性和安全性。
  • 安全性:在显示用户输入的内容时,使用 Laravel Blade 的 {{ $variable }} 语法(会自动进行 HTML 实体编码)来防止 XSS 攻击。避免使用 !! $variable !!,除非你明确知道内容是安全的 HTML。
  • 日期格式化:建议在模型中定义 casts 属性或使用 accessor 来统一日期格式化,而不是每次在 Blade 模板中都调用 date() 函数。
  • 用户体验:考虑添加评论分页、懒加载回复、以及回复表单的集成等功能,以提升用户体验。

通过上述步骤,你可以在 Laravel 应用中构建一个功能完善且性能优异的评论与回复系统。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
laravel组件介绍
laravel组件介绍

laravel 提供了丰富的组件,包括身份验证、模板引擎、缓存、命令行工具、数据库交互、对象关系映射器、事件处理、文件操作、电子邮件发送、队列管理和数据验证。想了解更多laravel的相关内容,可以阅读本专题下面的文章。

320

2024.04.09

laravel中间件介绍
laravel中间件介绍

laravel 中间件分为五种类型:全局、路由、组、终止和自定。想了解更多laravel中间件的相关内容,可以阅读本专题下面的文章。

278

2024.04.09

laravel使用的设计模式有哪些
laravel使用的设计模式有哪些

laravel使用的设计模式有:1、单例模式;2、工厂方法模式;3、建造者模式;4、适配器模式;5、装饰器模式;6、策略模式;7、观察者模式。想了解更多laravel的相关内容,可以阅读本专题下面的文章。

373

2024.04.09

thinkphp和laravel哪个简单
thinkphp和laravel哪个简单

对于初学者来说,laravel 的入门门槛较低,更易上手,原因包括:1. 更简单的安装和配置;2. 丰富的文档和社区支持;3. 简洁易懂的语法和 api;4. 平缓的学习曲线。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

374

2024.04.10

laravel入门教程
laravel入门教程

本专题整合了laravel入门教程,想了解更多详细内容,请阅读专题下面的文章。

85

2025.08.05

laravel实战教程
laravel实战教程

本专题整合了laravel实战教程,阅读专题下面的文章了解更多详细内容。

65

2025.08.05

laravel面试题
laravel面试题

本专题整合了laravel面试题相关内容,阅读专题下面的文章了解更多详细内容。

68

2025.08.05

json数据格式
json数据格式

JSON是一种轻量级的数据交换格式。本专题为大家带来json数据格式相关文章,帮助大家解决问题。

419

2023.08.07

clawdbot ai使用教程 保姆级clawdbot部署安装手册
clawdbot ai使用教程 保姆级clawdbot部署安装手册

Clawdbot是一个“有灵魂”的AI助手,可以帮用户清空收件箱、发送电子邮件、管理日历、办理航班值机等等,并且可以接入用户常用的任何聊天APP,所有的操作均可通过WhatsApp、Telegram等平台完成,用户只需通过对话,就能操控设备自动执行各类任务。

19

2026.01.29

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Sass 教程
Sass 教程

共14课时 | 0.8万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.1万人学习

CSS教程
CSS教程

共754课时 | 24.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号