学习java已经有一年多了,一直想写一个博客来记录自己的学习历程,同时也跟大家分享一下自己的学习时踩过的坑;想法想了很长的时间,最近终于开始动工了,项目主要使用springboot,MybatisPlus;
博客的主体肯定就是文章,一片文章的评论时至关重要的,可以便于用户之间的交流,同时也可以看下其他盆友的更好意见,然后评论这个就难住了我,思考再三,再综合自己的项目,给出了一个相对简单的需求;
需求:
用户可以评论,也看也回复评论,其他用户还可以评论评论的回复,总之像微博那种;
评论表
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import com.baomidou.mybatisplus.extension.activerecord.Model;
import lombok.Getter;
import lombok.Setter;
/**
* @author create by Erys
* @email [email protected]
* @date 2019/4/29 23:37
* @description 评论表
* 表中的levelFlag为评论等级,1表示一级,主要是文章的直接评论, 2表示二级,主要是主题评论的回复
**/
@Getter
@Setter
@TableName("tbl_article_comment")
public class Comment extends Model {
/**
* 主键
*/
@TableId("comment_id")
private long commentId;
/**
* 用户Id
*/
private long openUserId;
/**
* 文章Id
*/
@TableField("article_id")
private long articleInfoId;
/**
* 评论内容
*/
private String commentContent;
/**
* 父级评论Id
*/
private long parentCommentId;
/**
* 评论等级
*/
private int levelFlag;
/**
* 创建时间
*/
private String createTime;
/**
* 修改时间
*/
private String updateTime;
}
我的表设计的很简单,因为本身项目就很简单,而且估计流量也不多,需求没有那么的大,别的话不说,如果你自己有更复杂的需求,可以自己再设计,我只是提供一个思路;
前端需求:
类似于这种:
/**
某某某 评论:你好
她她她 回复 某某某: 回复你好
你你你 回复 她她她: 哈哈哈哈
他他他 回复: 回复你不好
我我我 评论:辣鸡
小仙女 回复 我我我: 你才是辣鸡
**/
抱歉,我以这种简陋的方式大家展示(手动捂脸)!!
既然需求搞清楚了,基本就可以操作了,看这个前端需求,和一个数据结构有点像,就是树形结构,具体看下面的图(其实是手打的)
/**
* * root
* * / | \
* * 1 2 3
* * / | | | \
* * 4 5 6 7 8
**/
所以就直接以树的形式进行组装就行了;
import lombok.Getter;
import lombok.Setter;
import java.util.List;
@Getter
@Setter
public class CommentNodeTree {
private long commentId;
private long openUserId;
private String avatar;
private String nickName;
private String commentContent;
private String createTime;
private List commentNodeTrees;
}
其中commentNodeTrees为root的下一层的节点集合;
具体的service层求树节点:
@Override
public IPage commentOnArt(long articleId, IndexPage indexPage) {
// 1 查询评论等级为1的评论
PageHelper pageHelper = new PageHelper<>(indexPage);
Wrapper commentWrapper = new QueryWrapper<>();
HashMap params = new HashMap<>(2);
params.put("article_id", articleId);
params.put("level_flag", 1);
((QueryWrapper) commentWrapper).allEq(params);
((QueryWrapper) commentWrapper).orderByDesc("create_time");
pageHelper = (PageHelper) commentMapper.selectPage(pageHelper, commentWrapper);
List levelOne = pageHelper.getRecords();
if (levelOne.size() == 0) {
throw new ArticleNotFoundException("文章不存在");
}
List trees = new ArrayList<>();
int size = levelOne.size();
for (int i = 0; i < size; i++) {
CommentNodeTree commentNodeTree = new CommentNodeTree();
Comment comment = levelOne.get(i);
commentNodeTree.setCommentId(comment.getCommentId());
commentNodeTree.setCommentContent(comment.getCommentContent());
commentNodeTree.setOpenUserId(comment.getOpenUserId());
commentNodeTree.setCreateTime(comment.getCreateTime());
// todo 缺少用户的信息
deepSearch(commentNodeTree);
trees.add(commentNodeTree);
}
PageHelper commentNodeTreePageHelper = new PageHelper<>(indexPage);
commentNodeTreePageHelper.setRecords(trees);
return commentNodeTreePageHelper;
}
/**
* 递归进行求树形节点
* @param commentNodeTree 评论树
*/
private void deepSearch(CommentNodeTree commentNodeTree) {
if (commentNodeTree == null) {
return;
}
List commentNodeTrees = openUserMapper.getSecondClassByParentId(commentNodeTree.getCommentId());
if (commentNodeTrees.size() == 0) {
return;
}
for (int i = 0; i < commentNodeTrees.size(); i++) {
deepSearch(commentNodeTrees.get(i));
commentNodeTree.setCommentNodeTrees(commentNodeTrees);
}
}
使用递归进行组装评论树,这样就OK了;
结果就是
{
"body": {
"records": [
{
"commentId": 1,
"openUserId": 123456789,
"avatar": null,
"nickName": null,
"commentContent": "你好",
"createTime": "2018-05-02 00:00:00.0",
"commentNodeTrees": [
{
"commentId": 2,
"openUserId": 123456789,
"avatar": null,
"nickName": null,
"commentContent": "回复你好",
"createTime": "2018-05-02 00:00:00.0",
"commentNodeTrees": [
{
"commentId": 6,
"openUserId": 123456789,
"avatar": null,
"nickName": null,
"commentContent": "回复回复你好",
"createTime": "2018-05-02 00:00:00.0",
"commentNodeTrees": null
}
]
},
{
"commentId": 3,
"openUserId": 123456789,
"avatar": null,
"nickName": null,
"commentContent": "回复你好",
"createTime": "2018-05-02 00:00:00.0",
"commentNodeTrees": [
{
"commentId": 7,
"openUserId": 123456789,
"avatar": null,
"nickName": null,
"commentContent": "2恢复恢复你好",
"createTime": "2018-05-02 00:00:00.0",
"commentNodeTrees": null
}
]
},
{
"commentId": 4,
"openUserId": 123456789,
"avatar": null,
"nickName": null,
"commentContent": "回复你好",
"createTime": "2018-05-02 00:00:00.0",
"commentNodeTrees": null
},
{
"commentId": 5,
"openUserId": 123456789,
"avatar": null,
"nickName": null,
"commentContent": "回复你好",
"createTime": "2018-05-02 00:00:00.0",
"commentNodeTrees": null
}
]
}
],
"total": 0,
"size": 12,
"current": 1,
"searchCount": true,
"pages": 0
},
"code": 1,
"msg": "OK"
}
这样的结果对于前端开发人员也很好组装组件,更加的友好,如果我的文章帮助到大家,请给我点个喜欢吧,谢谢!
如果有大佬有更好的建议,就请快速的评论给我,我好改进,互相进步!