知识点:了解服务端分页逻辑
初始化时获取服务回传参数 pageSize, totalCount,
template
<Page :total="page.totalCount" :pageSize="page.pageSize" @on-change="currentNote" show-total ></Page>
js (赋值给page元素 页码,总条数)
// result:异步response
this.page.pageSize = result.pageSize
this.page.totalCount = result.totalCount
this.page.totalPage = result.totalPage
num:跳转页码
async currentNote (pageNumber) {
this.noteList.length = 0
// 通过页码请求想服务器请求第pageNumber页的数据
const result = await getNoteList(pageNumber)
this.noteList = result.result
}
思考:服务器分页更多考虑到当整体数据量很大时,避免一次加载造慢的现象