feat: 评论支持回复(两级 + @某人)
不做无限层级——手机屏幕撑不住层层缩进,读到第四层就没法看了。
微信、小红书、B站清一色是两级:一级评论 + 其下的回复列表,回复里
用「回复 @某人」表达指向谁。
数据结构:comments 加 parent_id + reply_to_name。回复的回复会被
压平到同一条一级评论下(parent_id 取爷爷的),同时把被回复人的名字
记进 reply_to_name —— 这样既保住两级,又不丢「在跟谁说话」的信息。
几个容易做错的地方:
- 一次查完这一页所有一级评论的回复,不是每条一次查询(N+1)
- 一级评论默认只带 3 条回复,其余点「展开全部 N 条」再拉,避免热门
评论一次返回几百条
- 删一级评论要连它下面的回复一起删,否则回复变成挂在空处的孤儿;
帖子的 comment_count 也要按实际删除条数减,不是减 1
- total 统计含回复,和帖子上显示的数字对得上
- replies 为空时返回 [],不是 null
实测四条评论(含一条回复的回复):
▸ 甲:一级评论 (2 条回复)
└ 乙:多久了?
└ 甲 回复 乙:三天了
▸ 乙:另一条一级评论 (0 条回复)
删掉第一条一级评论后 total 4→1,comment_count 同步。
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
@@ -321,7 +321,7 @@ module.exports.sel = function (map, key, index, def) {
|
||||
<block wx:elif="{{innerType === 'comments'}}">
|
||||
<view class="sheet-h3">评论 {{comments.length ? comments.length : ''}}</view>
|
||||
|
||||
<view wx:for="{{comments}}" wx:key="id" class="cm" bindlongpress="onDeleteComment" data-index="{{index}}">
|
||||
<view wx:for="{{comments}}" wx:key="id" class="cm">
|
||||
<view class="cm-av">{{item.initial}}</view>
|
||||
<view class="cm-body">
|
||||
<view class="cm-head">
|
||||
@@ -329,12 +329,28 @@ module.exports.sel = function (map, key, index, def) {
|
||||
<text wx:if="{{item.is_self}}" class="mine-tag">我</text>
|
||||
<text class="cm-time">{{item.timeText}}</text>
|
||||
</view>
|
||||
<view class="cm-text">{{item.content}}</view>
|
||||
<view class="cm-text" bindlongpress="onDeleteComment" data-id="{{item.id}}" data-self="{{item.is_self}}">{{item.content}}</view>
|
||||
<view wx:if="{{item.imgs.length}}" class="cm-imgs">
|
||||
<image wx:for="{{item.imgs}}" wx:for-item="u" wx:key="*this" class="cm-img"
|
||||
src="{{u}}" mode="aspectFill" catchtap="onPreviewCommentImage"
|
||||
data-urls="{{item.imgs}}" data-cur="{{u}}"></image>
|
||||
</view>
|
||||
|
||||
<!-- 回复:只缩进一层。再深就没法在手机上读了 -->
|
||||
<view wx:if="{{item.replies.length}}" class="cm-replies">
|
||||
<view wx:for="{{item.replies}}" wx:for-item="r" wx:key="id" class="cm-reply"
|
||||
bindlongpress="onDeleteComment" data-id="{{r.id}}" data-self="{{r.is_self}}">
|
||||
<text class="cm-name">{{r.author_name}}</text>
|
||||
<text wx:if="{{r.reply_to_name}}" class="cm-at"> 回复 {{r.reply_to_name}}</text>
|
||||
<text class="cm-name">:</text>{{r.content}}
|
||||
</view>
|
||||
<view wx:if="{{item.reply_n > item.replies.length}}" class="cm-more"
|
||||
bindtap="onExpandReplies" data-id="{{item.id}}" data-index="{{index}}">
|
||||
展开全部 {{item.reply_n}} 条回复
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="cm-act" bindtap="onReplyTo" data-id="{{item.id}}" data-name="{{item.author_name}}">回复</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -342,7 +358,11 @@ module.exports.sel = function (map, key, index, def) {
|
||||
<view wx:if="{{comments.length}}" class="cm-tip">长按自己的评论可删除</view>
|
||||
|
||||
<view class="cm-editor">
|
||||
<textarea class="textarea cm-ta" placeholder="友善交流,分享你的经验…" placeholder-class="placeholder"
|
||||
<view wx:if="{{replyTo.name}}" class="cm-replying">
|
||||
<text>回复 {{replyTo.name}}</text>
|
||||
<view class="cm-cancel" bindtap="onCancelReply"><pt-icon name="close" size="{{24}}"></pt-icon></view>
|
||||
</view>
|
||||
<textarea class="textarea cm-ta" placeholder="{{replyTo.name ? '回复 ' + replyTo.name : '友善交流,分享你的经验…'}}" placeholder-class="placeholder"
|
||||
value="{{commentText}}" bindinput="onCommentInput" maxlength="500"
|
||||
auto-height="{{true}}" show-confirm-bar="{{false}}" cursor-spacing="24"></textarea>
|
||||
<view wx:if="{{commentImages.length}}" class="img-picker" style="margin-top:16rpx">
|
||||
|
||||
Reference in New Issue
Block a user