美文网首页
iview (view ui) 服务器端分页

iview (view ui) 服务器端分页

作者: guotanxiangg | 来源:发表于2019-11-28 00:10 被阅读0次

    知识点:了解服务端分页逻辑

    初始化时获取服务回传参数 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
    }
    

    思考:服务器分页更多考虑到当整体数据量很大时,避免一次加载造慢的现象

    相关文章

      网友评论

          本文标题:iview (view ui) 服务器端分页

          本文链接:https://www.haomeiwen.com/subject/xofvwctx.html