18-Beego优选复杂分页

这里将实现商品列表页的分页,必不可少的一步是要学会分析现有网页的分页规则,并且学会利用现有网页的元素节省时间,话不多说,让我们来实现商品的分页显示,让越来越多的商品数据整齐排列吧

效果图.gif

0.语法注意点

如果要遍历切片,创建切片的时候必须指点切片的长度否则会报错

image.png

1.新知识

1.给切片赋值:切片名称=[ ]数据类型{数据1,数据2}

image.png

2.模板语法不等于

image.png
3.限制获取数据起始位置和条数.Limit(pageSize,pageStart)

2.操作

如果借用其它网页上的元素,需要右键点击检查,即可得到网页上元素源代码,搬运到自己的网页上

3.逻辑注意点

1.上一页和最后一页要判断当前页,不是遍历元素
2.比较哪里该...要是遍历元素,不是当前页

一.业务逻辑

分页.png

二.界面分析

分析:
1.如果页数小于等于7页, 那么有多少页就显示多少页
1 2 3 4
2.如果页数大于7页, 那么有两种情况
当前索引小于等于4的时候, 最后显示 ... 总页数
1 2 3 4 5...8
当前索引大于等于总页数-3的时候, 前面显示 1 ...
1 ... 5 6 7 8

效果图.gif

三.复杂分页逻辑代码

1.准备相关数据
1.1 当前页码
1.2 每一页显示商品个数
1.3 当前分类总商品数
1.4 当前分类商品总页数
2.创建页码对应切片元素

image.png
image.png

四.复杂分页界面代码

image.png

五.每页显示商品数量限制

1.计算起始商品位置
2.限制获取商品条数

image.png
image.png