Skip to content

前端假分页

js
//  这是关键   tableData.slice((pageParams1.current-1)*pageParams1.size,pageParams1.current*pageParams1.size)"
<el-table   :data="tableData.slice((pageParams1.current-1)*pageParams1.size,pageParams1.current*pageParams1.size)">
        ...
</el-table>

	<el-pagination @size-change="handleSizeChange1" @current-change="handleCurrentChange1"
				:current-page="currentPage1" :page-sizes="[5, 10, 20, 30]" :page-size="pageSize1"
				layout="total, sizes, prev, pager, next, jumper" :total="this.tableData.length">
	</el-pagination>
//  这是关键   tableData.slice((pageParams1.current-1)*pageParams1.size,pageParams1.current*pageParams1.size)"
<el-table   :data="tableData.slice((pageParams1.current-1)*pageParams1.size,pageParams1.current*pageParams1.size)">
        ...
</el-table>

	<el-pagination @size-change="handleSizeChange1" @current-change="handleCurrentChange1"
				:current-page="currentPage1" :page-sizes="[5, 10, 20, 30]" :page-size="pageSize1"
				layout="total, sizes, prev, pager, next, jumper" :total="this.tableData.length">
	</el-pagination>

Script

js
		// 每页多少条
	handleSizeChange1(val) {
			console.log(`每页 ${val} 条`);
			this.pageSize1 = val;
		},
		// 当前页
		handleCurrentChange1(val) {
			console.log(`当前页: ${val}`);
			this.currentPage1 = val;
		},
		// 每页多少条
	handleSizeChange1(val) {
			console.log(`每页 ${val} 条`);
			this.pageSize1 = val;
		},
		// 当前页
		handleCurrentChange1(val) {
			console.log(`当前页: ${val}`);
			this.currentPage1 = val;
		},

反快餐主义者