vue实现显示10条数据点击查询看更多…
要求如下:
当页面的数据超过10条时只显示10条 且显示
点我查看更多喔~
每次点击 页面数据增加10条
- 思路解析:
如题 假设有20条数据== 只显示10条 点击查看更多按钮(每次点击增加10条)
设想需要的参数:
1.所有的数据有多少数据? sum 当前需要展示多少条数据 (index) 我可以设定点击次数
当前点击次数(1/2/3 *10条) 第n页 n*10 则是需要的数据 与MySQL 中的limit有相似之处
2.点击查看更多按钮/其他(隐藏该属性) 这里定义为 result 结果为true 或 false
true : 想象一下 如果当前展示的条数与总条数相同 说明 数据加载完成 则本按钮应该"去掉"
false: 说明数据没有加载完成 所以按钮不应该被"去掉"
3. 数组的处理方法slice(起始值,偏移量)
slice(参数1,参数2) :从已有的数组中返回选定的元素(数组单元的截取)
参数1:从何处开始选取(截取数组单元起始位置的索引下标)
参数2:从何处结束选取(截取数组单元结束位置的索引下标)
- 代码部分:
data