分页功能:

1. 判断当前页和总页数
2. 追加数据
This commit is contained in:
jqtmviyu@gmail.com 2021-02-25 22:10:52 +08:00
parent 768ecbcabc
commit e24fdd64d3

View File

@ -41,7 +41,21 @@
</view>
</template>
<script>
<script>
// 请求参数, 放全局变量
const Params = {
// 关键字
query: "",
// 分类id
cid: null,
// 页码
pagenum: 1,
// 页容量 一页有几条数据
pagesize: 10
}
// 总页数
let TotalPage = 0
export default {
data(){
return{
@ -63,28 +77,33 @@ export default {
},
async onLoad ({ id }){
console.log(id)
const params = {
// 关键字
query: "",
Params.cid = id
this.getGoods()
},
// 分类id
cid: id,
// 页码
pagenum: 1,
// 页容量 一页有几条数据
pagesize: 10
// 滚动条到底触发
onReachBottom(){
// 判断有没有下一页
if(Params.pagenum >= TotalPage){
console.log("没有下一页数据了")
}else{
console.log("翻页")
Params.pagenum++
this.getGoods()
}
// 从接口拿数据
const {message} = await this.$u.api.getGoods(params)
console.log(message)
this.goods = message.goods
},
methods: {
// 从接口拿数据
async getGoods (){
const {message} = await this.$u.api.getGoods(Params)
console.log(message)
// 追加数据
this.goods = [...this.goods, ...message.goods]
// 总页数
TotalPage = Math.ceil(message.total / Params.pagesize)
},
// 切换子页面
onTapsChange(index){
this.tabsCurrent = index
}