基于 Spring Boot 博客系统开发(四)
本系统是简易的个人博客系统开发,为了更加熟练地掌握 SprIng Boot 框架及相关技术的使用。🌿🌿🌿
基于 Spring Boot 博客系统开发(三)👈👈
阅读排行榜实现
阅读排行榜实现涉及到联表查询,主要有两种方式,一种自定义SQL查询,另一种循环查询。
两种方式可以参考这篇文章:springboot 联表查询。
这里主要以第一种查询来实现。
阅读排行榜主要涉及两个表分别article表和statistic表,两个表的关系图为一对一:
接下来使用自定义SQL方式来实现该功能。
1、创建VO包和热门文章类,VO表示视图对象
@Data
public class HotArticleVO {
private Long id;
private String title;
private Integer hits;
}
2、编写mapper.xml文件,在ArticleMapper.xml 添加查询SQL
<mapper namespace="cn.qvtu.web.mapper.ArticleMapper">
<resultMap id="HotArticleVOResult" type="HotArticleVO">
<id property="id" column="id"></id>
<result property="title" column="title"></result>
<result property="hits" column="hits"></result>
</resultMap>
<select id="selectHotArticle" resultMap="HotArticleVOResult">
SELECT a.id, a.title,s.hits FROM t_article a LEFT JOIN t_statistic s ON s.article_id = a.id order by s.hits desc
</select>
</mapper>
这里type=“HotArticleVO” 没有写全包名路径,需要配置XML映射文件中指定的实体类别名路径
# 配置XML映射文件中指定的实体类别名路径
mybatis-plus.type-aliases-package=cn.qvtu.web.domain,cn.qvtu.web.vo
3、Mapper类添加执行方法,跟select id一致
@Mapper
public interface ArticleMapper extends BaseMapper<Article> {
public List<HotArticleVO> selectHotArticle();
}
4、Service 接口也添加对应调用方法
IArticleService 接口
public interface IArticleService extends IService<Article> {
public List<HotArticleVO> selectHotArticle();
}
ArticleServiceImpl 实现类
@Service
public class ArticleServiceImpl extends ServiceImpl<ArticleMapper, Article> implements IArticleService {
@Autowired
private ArticleMapper articleMapper;
@Override
public List<HotArticleVO> selectHotArticle() {
return articleMapper.selectHotArticle();
}
}
5、Controller 调用articleService.selectHotArticle获取热点文章集合
HomeController.java
@RequestMapping("/")
public String home(@RequestParam(defaultValue = "1") Integer pageNum, Model model){
PageHelper.startPage(pageNum, 5);
List<Article> articleList = articleService.list();
PageInfo<Article> articlePage = new PageInfo<>(articleList);
model.addAttribute("articlePage",articlePage);
PageHelper.startPage(1, 10);
List<HotArticleVO> hotArticleList = articleService.selectHotArticle();
model.addAttribute("hotArticleList",hotArticleList);
return "client/index";
}
6、前端使用thymeleaf渲染
<!-- 阅读排行榜 -->
<div class="am-u-md-4 am-u-sm-12 blog-sidebar">
<div class="blog-sidebar-widget blog-bor">
<h2 class="blog-text-center blog-title"><span>阅读排行榜</span></h2>
<div style="text-align: left">
<th:block th:each="article,stat:${hotArticleList}" >
<a style="font-size: 15px;" th:href="${'/article/'+article.id}">[[${stat.count}]]、[[${article.title}]]([[${article.hits}]])</a>
<hr style="margin-top: 0.6rem;margin-bottom: 0.4rem" />
</th:block>
</div>
</div>
</div>