js+vue front-end paging processing

Front-end paging processing

Recently, I often encounter situations where the back-end cannot do paging processing, but the front-end needs paging query, emm. . . . Ten thousand alpacas galloping past

 flipOver () {
    
    
      const pageSize = this.pageInfo.pageSize  // 每页条数
      const pageNo = this.pageInfo.pageNo // 当前页
      const arr = this.tableList// 要分页的arr
      var pagingNum = (pageNo- 1) * pageSize;
      var newArr =
        pagingNum + pageSize >= arr.length
          ? arr.slice(pagingNum , arr.length)
          : arr.slice(pagingNum , pagingNum + pageSize);
      this.detealis = newArr;
    }

In Vue, after calling this method once in the query interface, you can then call it in the paging method.

async getDataList() {
    
    
      // 获取列表信息
      this.loading = true;
      this.$API.onlineQueryPaybackHttp().then(result=>{
    
    
        const pageResult = result.pageResult || {
    
    }
        this.tableList= pageResult.records || []
        this.pageInfo.total = this.tableList.length;
        this.pageBreak()
        this.loading = false;
      }).catch(err=>{
    
    
        this.loading = false;
      })
 currentChange(pageNo) {
    
    
      this.pageNo = pageNo;
      this.flipOver()
    },

Guess you like

Origin blog.csdn.net/qq_32881447/article/details/112583292