SpringBoot-实现回复列表显示的功能

前端代码

1. question.html

<!--评论列表展示部分-->
            <h4><span th:text="${question.commentCount}"></span> 个回复</h4>
            <hr class="col-lg-12 col-md-12 col-sm-12 col-xs-12 comment-hr">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 comments" th:each="comment : ${commentList}">
                <div class="media">
                    <div class="media-left">
                        <a href="#">
                            <img th:src="${comment.user.avatarUrl}" class="media-object img-rounded">
                        </a>
                    </div>
                    <div class="media-body">
                    <h5 class="media-heading">
                        <span th:text="${comment.user.name}"></span>
                    </h5>
                    <!--评论内容-->
                    <div th:text="${comment.content}"></div>
                    <!--对评论的操作-->
                    <div class="comment-operate">
                        <span class="glyphicon glyphicon-thumbs-up icon"></span> <!--点赞-->
                        <span class="glyphicon glyphicon-comment icon"></span> <!--评论-->
                        <span class="pull-right" th:text="${#dates.format(comment.timeModified,'yyyy-MM-dd HH:mm')}"></span></span>
                    </div>
                </div>
                </div>
            </div>

2. css

.comments{
    margin-bottom: 15px;
    border-bottom: 1px solid #eeeeee;
    padding-bottom: 5px;
}
.comment-hr{
    margin-top: 0;
}
.comment-operate{
    display: block;
    color: #999999;
    font-size: 13px;
    margin-bottom: 15px;
}
.comment-operate .icon{
    margin-right: 6px;
    font-size: 15px;
    cursor: pointer;
}
.comment-operate .icon:hover{
    color: #499ef3;
}

后端逻辑

1. 创建CommentDTO
   注：之前为了接受页面戳过来的关于comment的值，已经创建了一个，将旧的名字改为CommentCreateDTO

package com.july.community.dto;

import com.july.community.model.User;
import lombok.Data;

@Data
public class CommentDTO {
    private Long id;

    private Long parentId;

    private Integer type;

    private Long commentator;

    private Long timeCreate;

    private Long timeModified;

    private Long likeCount;

    private String content;
    
    private User user;
}

2. questionController

//获取问题的评论
        List<CommentDTO> commentList = commentService.getLisetByQuestionId(id);
        model.addAttribute("commentList",commentList);  

3. commentService

public List<CommentDTO> getLisetByQuestionId(Long questionId) {
        List<CommentDTO> commentDTOList = new ArrayList<>();
        //查评论信息
        CommentExample commentExample = new CommentExample();
        commentExample.createCriteria().andParentIdEqualTo(questionId)
                                .andTypeEqualTo(CommentTypeEnum.QUESTION.getType());
        List<Comment> commentList = commentMapper.selectByExample(commentExample);
        if (commentList.size()==0){
            //没有评论
            return new ArrayList<>();
        }
        //获得所有去重的评论人id(可以去除重复的数据)
        List<Long> commentatorIds = commentList.stream().map(comment -> comment.getCommentator()).collect(Collectors.toList());
        //查询评论人的信息
        UserExample userExample = new UserExample();
        userExample.createCriteria().andIdIn(commentatorIds);
        List<User> userList = userMapper.selectByExample(userExample);
        //将查询到的userList转换成map，以减少接下来循环的层数，减小时间复杂度
        Map<Long, User> userMap = userList.stream().collect(Collectors.toMap(user -> user.getId(), user -> user));
        //转换comment为commentDTO
        List<CommentDTO> commentDTOs = commentList.stream().map(comment -> {
            CommentDTO commentDTO = new CommentDTO();
            BeanUtils.copyProperties(comment,commentDTO);
            commentDTO.setUser(userMap.get(comment.getCommentator()));
            return commentDTO;
        }).collect(Collectors.toList());
        return commentDTOs;

        /*//原来的传统方法
        for (Comment comment : commentList) {
            CommentDTO commentDTO = new CommentDTO();
            User user = userMapper.selectByPrimaryKey(comment.getCommentator());
            BeanUtils.copyProperties(comment,commentDTO);
            commentDTO.setUser(user);
            commentDTOList.add(commentDTO);
        }*/
        }
    

ok