#簡単なページネーションを行います。
- 表示する量の制限
などができるようになります。
#前提(環境・完成図)
- 基本的なWeb開発ができて、CRUDもできている人向け(GetMappingの説明などは省いています)
##環境
Version | |
---|---|
Kotlin | 1.3.60 |
spring Boot | 2.2.2 |
#ページネーションを表示する
行う場所(ファイル)は、
- Service
- Controller
- Repository
##1. Controller
import org.springframework.data.domain.Pageable
@GetMapping("/")
fun index(model: Model, pageable: Pageable): String { // pageable: Pageableを追加
val bookinfo = bookInfoservice.getfindAll(pageable) // bookInfoserviceから、getfindAll関数を呼び出す(引数は「pageable」にする)
model.addAttribute("bookdata", bookinfo)
return "Book/index"
}
-
import org.springframework.data.domain.Pageableを追加する
-
index関数の引数に「pageable: Pageable」を追加する
-
Serviceレイヤ(ここでは、bookInfoservice)から、getfindAll関数を呼び出している。
-
引数には、pageableを追加
そして・・・
##2. Service
import org.springframework.data.domain.Pageable
import org.springframework.data.domain.PageRequest
fun getfindAll(pageable: Pageable) = bookRepository.findAll(PageRequest.of(pageable.pageNumber, 5))
- getfindAll関数を呼び出す
- Repositoryレイヤ(bookRepository)から、findAll関数を呼び出す。
- 引数には、PageRequest.of(page, size)を入れる
※ PageRequest.of(何ページ目を表示するのか, どれだけ表示したいのか) -> 全て数値で入れる
※ pageable.pageNumberは、pageableリクエストに含まれる一つの値です。
Page request [number: 2,・・・・・] このようにレスポンスが返ってきます。
そして・・・・
##3. Repository
override fun findAll(pageable: Pageable): Page<クラス名>
-
findAll関数は、標準で入っているため、override(オーバーライド)をして、関数を定義する。(新しい関数の場合は、overrideをする必要がない。)
-
返り値は、Page<クラス名>とすれば、OK!
※Page<クラス名>・・・クラス名は、Entity内のdataクラス名などを入れる。or dbを作る際に使うクラス名を使う
##4. 完了。 Thymeleaf側で、ページをめくれるようにする。
<div th:fragment='pagination'>
<ul>
<li th:class="${bookdata.first}" style="display:inline">
<span th:if="${bookdata.first}">←先頭</span>
<a th:if="${not bookdata.first}" th:href="@{${url}(page=0)}">←先頭</a>
</li>
<li th:each='i : ${#numbers.sequence(0, bookdata.totalPages-1)}' th:class="(${i}==${bookdata.number})? 'active' : ''" style="display:inline">
<span th:if='${i}==${bookdata.number}' th:text='${i+1}'>1</span>
<a th:href="@{${url}(page=${i})}">
<span th:text='${i+1}'>1</span>
</a>
</li>
<li th:class="${bookdata.last}" style="display:inline">
<span th:if="${bookdata.last}">末尾➝</span>
<a th:if="${not bookdata.last}" th:href="@{${url}(page=(${bookdata.totalPages}-1))}">末尾➝</a>
</li>
</ul>
</div>
※ ${bookdata}には現在のページの数字が入っています。 -> bookdata.numberで取り出すことが可能
終了!!
#まとめ
- 基本的な(CRUDが入っている)実装があれば、コードを少し追加するだけで完成できるかもしれない。
- PageableとPageの使い方でページネーションの実装は可能であること
#感想
今回のページネーションをSpring Bootで実装をするときは、Javaで行っている記事が多かったため、苦労しました。また、Kotlin + Spring Bootで実装しているものが少ない印象を持ったので、これから、少しずつアウトプットができればと思っております。