在安企CMS中，文章详情页的评论列表是提升用户互动和内容活力的重要组成部分。要将这些评论自然流畅地展示出来，并实现友好的分页体验，我们需要巧妙地运用commentList和pagination这两个模板标签。接下来，我们就一起看看如何在文章详情页中实现评论的展示与分页功能。
一、commentList标签：展示评论的基础
安企CMS的commentList标签是专门用来获取和展示文章评论数据的。在文章详情页中，它能够帮助我们轻松地调取当前文章的所有评论，无论是最新评论还是回复评论，都能通过这个标签来处理。
它的基本用法是：
{% commentList comments with archiveId=archive.Id type="list" limit="6" %}
{# 在这里循环展示评论 #}
{% endcommentList %}
其中，comments是我们为评论列表数据定义的变量名，你可以根据自己的习惯来命名。
几个关键参数的解释：
archiveId：这个参数是必不可少的，它告诉commentList标签要获取哪篇文章的评论。在文章详情页中，我们可以通过archive.Id（由archiveDetail标签或页面上下文提供）来获取当前文章的ID。type：这个参数决定了评论列表的展示方式。当我们设置为type="list"时，它会获取指定数量的评论；如果设置为type="page"，则会启用分页功能，通常配合pagination标签使用。limit：当type="list"时，这个参数指定了最多显示多少条评论。例如，limit="6"表示只显示最新的6条评论。order：可以用来控制评论的排序方式，比如order="id desc"表示按评论ID倒序（最新评论在前）。siteId：如果你管理着多个站点，并需要调用其他站点的评论，可以通过这个参数指定站点ID。
评论数据包含的常用字段：
comments变量循环出的每一条评论（我们通常命名为item）都包含一些有用的字段，比如：
Id：评论的唯一ID。UserName：评论者的昵称。Content：评论的具体内容。CreatedTime：评论发布的时间戳，需要用stampToDate格式化。Status：评论的审核状态，1表示通过，0表示待审核。ParentId：如果这是一条回复评论，它会指向被回复评论的ID。Parent：一个对象，包含被回复评论的完整数据，方便展示评论层级。
二、动手实践：展示非分页评论列表
我们先从最简单的评论列表开始，假设我们想在文章详情页底部展示最新的几条评论，而不需要分页。
{# 首先，确保你能获取到当前文章的ID。在文章详情页通常可以直接使用archive.Id #}
{# 如果页面上下文没有archive.Id，你可能需要先使用{% archiveDetail with name="Id" %}来获取 #}
<div class="comments-section">
<h3>读者评论</h3>
<ul class="comment-list">
{% commentList comments with archiveId=archive.Id type="list" limit="5" order="id desc" %}
{% for item in comments %}
{# 检查评论状态，只显示已审核通过的评论，或给出审核中的提示 #}
{% if item.Status == 1 %}
<li class="comment-item">
<div class="comment-meta">
<span class="comment-author">{{ item.UserName }}</span>
于
<span class="comment-time">{{ stampToDate(item.CreatedTime, "2006-01-02 15:04") }}</span>
说：
</div>
<div class="comment-content">
{% if item.Parent %}
<blockquote class="reply-to">
回复 <span class="original-author">{{ item.Parent.UserName }}</span>:
<p>{{ item.Parent.Content|truncatechars:100 }}</p> {# 截取部分内容，避免太长 #}
</blockquote>
{% endif %}
<p>{{ item.Content }}</p>
</div>
{# 这里可以添加点赞或回复按钮，具体功能需要JS和后台接口支持 #}
<div class="comment-actions">
<a href="javascript:;" class="btn-reply" data-id="{{ item.Id }}" data-user="{{ item.UserName }}">回复</a>
</div>
</li>
{% else %}
<li class="comment-item pending-review">
<div class="comment-meta">
<span class="comment-author">{{ item.UserName }}</span>
于
<span class="comment-time">{{ stampToDate(item.CreatedTime, "2006-01-02 15:04") }}</span>
评论：
</div>
<div class="comment-content">
<p>您的评论正在审核中，请耐心等待。</p>
</div>
</li>
{% endif %}
{% empty %}
<li class="no-comments">目前还没有评论，快来发表您的看法吧！</li>
{% endfor %}
{% endcommentList %}
</ul>
</div>
代码解析：
- 我们使用了一个
<ul>列表来包裹评论，每条评论是一个<li>。 item.Status用于判断评论是否已审核。未审核的评论我们显示了一个提示信息，并使用了truncatechars过滤器来截取内容。item.Parent的判断非常重要，它允许我们识别并展示回复关系，让评论看起来更有条理。当item.Parent存在时，表示这是一条回复，我们可以显示被回复者的昵称和部分内容。stampToDate(item.CreatedTime, "2006-01-02 15:04")将时间戳格式化为我们易读的日期时间格式。{% empty %}块在没有任何评论时显示一个友好提示。
三、进阶应用：评论分页显示
当文章评论数量较多时，一次性加载所有评论会影响页面性能和用户体验。这时，我们就需要引入分页功能。在安企CMS中，commentList配合pagination标签可以完美解决这个问题。
步骤如下：
- 修改
commentList的type参数为"page"：这告诉系统我们需要分页数据。 - 添加
pagination标签：这个标签会生成分页导航的链接和信息。
”`twig