springboot + Jpa 实现分页功能

Springboot 集成 Jpa 实现分页

由于用的技术并不复杂，所以我们开门见山，直接上代码

先来看下代码结构

pom.xml 引入相关jar包

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.3.4.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.example</groupId>
    <artifactId>springboot-blog</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>springboot-blog</name>
    <description>Blog project for Spring Boot</description>

    <properties>
        <java.version>1.8</java.version>
    </properties>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-jpa</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <dependency>
            <groupId>junit</groupId>
            <artifactId>junit</artifactId>
        </dependency>

        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <scope>runtime</scope>
        </dependency>
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
            <exclusions>
                <exclusion>
                    <groupId>org.junit.vintage</groupId>
                    <artifactId>junit-vintage-engine</artifactId>
                </exclusion>
            </exclusions>
        </dependency>
    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>

</project>

application.properties配置

# 配置数据源
spring.datasource.url=jdbc:mysql://localhost:3306/blog_system
spring.datasource.username=root
spring.datasource.password=root

#基本配置
spring.application.name=springboot-blog
server.port=8080

# 显示sql
spring.jpa.show-sql=true

实体类Article

@Data
@ToString
@Entity
@Table(name = "t_article")
public class Article {

    @Id
    private Integer id;

    @Column(name = "title")
    private String title;

    @Column(name = "content")
    private String content;

    @Column(name = "created")
    private Date created;

    @Column(name = "modified")
    private Date modified;

    @Column(name = "categories")
    private String categories;

    @Column(name = "tags")
    private String tags;

    @Column(name = "allow_comment")
    private Integer allowComment;

    @Column(name = "thumbnail")
    private String thumbnail;

}

ArticleDao层实现

public interface ArticleDao extends JpaRepository<Article, Integer> {

}

Article Service 层

ArticleService接口

public interface ArticleService {

    Page<Article> getArticleWithPage(Integer page, Integer size);

}

ArticleServiceImpl实现类

@Service
@Slf4j
public class ArticleServiceImpl implements ArticleService {

    @Autowired
    private ArticleDao articleDao;

    @Override
    public Page<Article> getArticleWithPage(Integer page, Integer size) {
        log.info("page is {}, size is {}", page, size);
        if (page <= 0) {
            page = 1;
        }
        Pageable pageRequest = PageRequest.of(page - 1, size);
        return articleDao.findAll(pageRequest);
    }
}

ArticleController 控制层实现

@Controller
@Slf4j
@RequestMapping("/article")
public class ArticleController {

    @Autowired
    private ArticleService articleService;

    @RequestMapping("/index")
    public String toIndex(Model model,
                          @RequestParam(value = "page", defaultValue = "1") Integer page,
                          @RequestParam(value = "size", defaultValue = "3") Integer size) {
        Page<Article> articles = articleService.getArticleWithPage(page, size);
        model.addAttribute("articles", articles);
        return "/client/index";
    }

}

页面核心代码

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!-- 载入文章头部页面，位置在/client文件夹下的header模板页面，模板名称th:fragment为header -->
<div th:replace="/client/header::header(null,null)"/>
<body>
<div class="am-g am-g-fixed blog-fixed index-page">
    <div class="am-u-md-8 am-u-sm-12">

        <!-- 文章遍历并分页展示 : 需要同学们手动完成，基本样式已经给出，请使用th标签及表达式完成页面展示 -->
        <div th:each="article:${articles.getContent()}">
            <article class="am-g blog-entry-article">

                <div class="am-u-lg-6 am-u-md-12 am-u-sm-12 blog-entry-text">
                    <!-- 文章分类 -->
                    <span th:text="${article.categories}" class="blog-color" style="font-size: 15px;"><a>默认分类</a></span>
                    <span>&nbsp;&nbsp;&nbsp;</span>
                    <!-- 发布时间 -->
                    <span style="font-size: 15px;" th:text="'发布于 '+ ${article.created}"/>
                    <h2>
                        <!-- 文章标题 -->
                        <div><a style="color: #0f9ae0;font-size: 20px;" th:text="${article.title}"/>
                        </div>
                    </h2>
                    <!-- 文章内容-->
                    <div style="font-size: 16px;" th:text="${article.content}"/>
                </div>
            </article>
        </div>

        <div class="page">
            <a th:href="@{/article/index}">首页</a>
            <a th:href="@{/article/index(page = ${articles.hasPrevious()} ? ${articles.getNumber() } : 1)}">上一页</a>
            <a th:href="@{/article/index(page = ${articles.hasNext()} ? ${articles.getNumber()} + 2 : ${articles.totalPages})}">下一页</a>
            <a th:href="@{/article/index(page = ${articles.totalPages})}">尾页</a></p>
        </div>

    </div>
    <!-- 博主信息描述 -->
    <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>
            <img th:src="@{/assets/img/me.jpg}" alt="about me" class="blog-entry-img"/>
            <p>
                Java后台开发
            </p>
            <p>个人博客小站，主要发表关于Java、Spring、Docker等相关文章</p>
        </div>
        <div class="blog-sidebar-widget blog-bor">
            <h2 class="blog-text-center blog-title"><span>联系我</span></h2>
            <p>
                <a><span class="am-icon-github am-icon-fw blog-icon"></span></a>
                <a><span class="am-icon-weibo am-icon-fw blog-icon"></span></a>
            </p>
        </div>
    </div>

</div>
</body>
<!-- 载入文章尾部页面，位置在/client文件夹下的footer模板页面，模板名称th:fragment为footer -->
<div th:replace="/client/footer::footer"/>
</html>

效果展示

源码

完整代码可以从我的码云上进行下载
https://gitee.com/tengfei-wang/springboot-blog