如果下一页不在当前列表中,但是小于pageList的长度,则需要变更当前显示的5个page列表,和更换当前的pageData,这个时候回到之前的currentPages方法中来变更当前的newPages。
如果下一页不在当前列表中,并且大于pageList的长度。则请求新的数据,变更列表
请求数据变更数据
2.上一页的操作
因为“上一页“数据均属于已经存在的状态,所以不涉及请求,只会设计变更列表和页面数据。开头的思路中已经说明
d.点击类别页面的方法changePage
变更数据即可
不足之处的思考
方法已经书写完毕了,思考一圈之后肯定能发现有很多不足之处吧,是的的确存在一些不足之处。
1.不应该靠currentPage这个属性来控制这么多的DOM元素的显示
2.因为是一次一次的请求数据,不能知道一共有多少数据和记录尾页,只能开最后一次请求时发现没有数据,给出提示,最好的方式应该是在请求最后一次之前能知道下一次没有数据。
3.有一些地方用了固定的数字来做处理,这样日后如果产品要改成显示10个页的列表呢?就得挨个改数字,所以最好用一个熟悉值来控制
对!!!没有给出完整的实例和代码。是的,写出来分享思路和基本方法,目的就是希望看到的人能和我交流思路和方法,给出更好的建议,而不是用来让别人复制粘贴的,这样毫无意义。
思考与总结
到这里所有的思路和方法都已经结合的讲解完毕,基本的代码也都分析全面,基于上面的方法和思想,来写一个适合你们项目框架的分页功能吧,最好能把它封装成一个组件,但是如果由于接口给的数据方式不同或者需求不同,功能实现起来可能会大相径庭,但是基本的思路和方法可以学习。