本節(jié)是建立在上節(jié)的基礎(chǔ)上，上一節(jié)給大家講了管理后臺(tái)表格如何展示數(shù)據(jù)，但是當(dāng)我們的數(shù)據(jù)比較多的時(shí)候我們就需要做分頁(yè)處理了。這一節(jié)給大家講解如何實(shí)現(xiàn)表格數(shù)據(jù)的分頁(yè)顯示。

準(zhǔn)備工作

還是老規(guī)矩，看效果圖

可以看出我們實(shí)現(xiàn)了如下功能

1，表格數(shù)據(jù)的展示

2，分頁(yè)效果的實(shí)現(xiàn)

3，上一頁(yè)和下一頁(yè)的實(shí)現(xiàn)

4，當(dāng)前選中頁(yè)碼加重顏色

下面來(lái)看實(shí)現(xiàn)步驟

一，定義表格和分頁(yè)組件

簡(jiǎn)單說(shuō)說(shuō)代碼

head里面是引入bootstrap的樣式庫(kù)

table定義表格來(lái)展示數(shù)據(jù)

ul里定義分頁(yè)

代碼如下：

freemarker+bootstrap學(xué)習(xí)

href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap.min.css">

id姓名微信操作

${productInfo.id}${productInfo.name}${productInfo.wechat}

下架

上架

#if>

#list>

• 上一頁(yè)

• 上一頁(yè)

#if>

${index}

${index}

#if>

#list>

下一頁(yè)

下一頁(yè)

#if>

二，定義好頁(yè)面后，我們就來(lái)獲取數(shù)據(jù)

同樣這里的數(shù)據(jù)我們先用模擬數(shù)據(jù)，后面會(huì)用數(shù)據(jù)庫(kù)里的數(shù)據(jù)。

看下面代碼可以看出來(lái)，我們模擬了6條數(shù)據(jù)，然后每頁(yè)顯示2條數(shù)據(jù)。

package com.qcl.demo.controller;

import com.qcl.demo.bean.Demo;

import org.springframework.web.bind.annotation.GetMapping;

import org.springframework.web.bind.annotation.RequestParam;

import org.springframework.web.bind.annotation.RestController;

import org.springframework.web.servlet.ModelAndView;

import java.util.ArrayList;

import java.util.List;

import java.util.Map;

/**

* Created by qcl on 2019-04-29

* 微信：2501902696

* desc:freemarker學(xué)習(xí)

*/

@RestController

public class DemoController {

/*

* 分頁(yè)效果的實(shí)現(xiàn)

* */

@GetMapping("/pageList")

public ModelAndView list(@RequestParam(value = "page", defaultValue = "1") Integer page,

@RequestParam(value = "size", defaultValue = "2") Integer size,

Map map) {

List demoList = new ArrayList<>(4);

demoList.add(new Demo(1, "標(biāo)題1", "編程小石頭1", "2501902696"));

demoList.add(new Demo(2, "標(biāo)題2", "編程小石頭2", "2501902696"));

demoList.add(new Demo(3, "標(biāo)題3", "編程小石頭3", "2501902696"));

demoList.add(new Demo(4, "標(biāo)題4", "編程小石頭4", "2501902696"));

demoList.add(new Demo(5, "標(biāo)題5", "編程小石頭4", "2501902696"));

demoList.add(new Demo(6, "標(biāo)題6", "編程小石頭4", "2501902696"));

demoList.add(new Demo(7, "標(biāo)題7", "編程小石頭7", "2501902696"));

int start = (page - 1) * 2;

int end = start + size;

List subList = demoList.subList(start, end);

int totalPage = (int) Math.ceil(demoList.size() / size);

map.put("productInfoPage", subList);

map.put("totalPage", totalPage);

map.put("currentPage", page);

map.put("size", size);

return new ModelAndView("demo/list", map);

}

}

三，啟動(dòng)springboot查看效果。

注意每一頁(yè)地址欄的url

可以看出，我們第一次訪問(wèn)時(shí)，默認(rèn)顯示第一頁(yè)，url里沒(méi)有page和size字段。

訪問(wèn)第2頁(yè)和第3頁(yè)時(shí)，url里就有了page和size。page是顯示那一頁(yè)，size是每頁(yè)顯示多少條數(shù)據(jù)。

到這里我們就實(shí)現(xiàn)的管理后臺(tái)的分頁(yè)效果。

我會(huì)把10小時(shí)實(shí)戰(zhàn)入門java系列課程錄制成視頻，如果你看文章不能很好的理解，可以去看下視頻：https://edu.csdn.net/course/detail/23443

有任何關(guān)于編程的問(wèn)題都可以加我微信2501902696(備注編程開發(fā))

編程小石頭，碼農(nóng)一枚，非著名全棧開發(fā)人員。分享自己的一些經(jīng)驗(yàn)，學(xué)習(xí)心得，希望后來(lái)人少走彎路，少填坑。

總結(jié)

以上是生活随笔為你收集整理的java freemarker 分页_10小时入门java开发04 springboot+freemarker+bootstrap快速实现分页功能...的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。