背景:
从别处选择一些数据在界面上用列表展示,列表为静态数据,故需要做分页处理。
解决方案:
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; }, }