elementui table的静态数据分页

当数据量比较多,但后台又是一次性将数据返回时,需要对静态数据惊醒分页显示

  1. 主要用到Array.prototype.slice()方法:slice 会提取原数组中索引从 begin 到 end 的所有元素(包含 begin,但不包含 end)
    2.监听分页的current-change事件,改变tableData的值
  • HTML部分

        
          
        
      
      
      
  • JS部分
data() {
    return {
      page: 1,
      pageSize: 15,
      tableData:[],
      tableDatas:{}
      col:[{prop: 'nsrlxDm', label: '纳税人类型'}, {prop: 'nsrmc', label: '纳税人名称'}]
    }
  },
methods:{
handleCurrentChange(val) {
      this.$emit('currentChange', val, this.selectedRow)
      this.tableData = this.tableDatas.data.slice((val-1)*this.pageSize,val*this.pageSize)
    },
}

3.主要改动为

image.png

图片来自:https://blog.csdn.net/Polarisone/article/details/103848817

你可能感兴趣的:(elementui table的静态数据分页)