背景:

从别处选择一些数据在界面上用列表展示,列表为静态数据,故需要做分页处理。

解决方案:

Array.prototype.slice()截取数据,slice(begin,end),从begin开始到end结束,不包括end,返回值是截取的数据,返回值类型为数组,不会改变原数组

代码:

  <el-table :data="taskList.slice((data.pageNum - 1) * data.pageSize, data.pageNum * data.pageSize)" stripe style="width: 100%">
  </el-table>
  <el-pagination @current-change="handleCurrentChange" :current-page.sync="data.pageNum" :page-size="data.pageSize" layout="pager, next, jumper" :total="taskList.length">
  </el-pagination>
export default {
     data() {
        return {
            taskList: [],
             data: {
                pageNum: 1,
                pageSize: 10,
     },
     methods: {
        handleCurrentChange(val) {
            this.pageNum = val;
        },
           
}
Logo

前往低代码交流专区

更多推荐