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