el-pagination分页-前端无分页查询字段，自定义生成查询功能

需求

• 后台无分页查询字段
• 使用el-pagination控制显示

要求

• 后台必须把数据全部返回到一个数组中
  

上代码

// html 部分
<el-table
	:data="tableData">
	<el-table-column
		label="ID"
		prop="id"
		width="50">
	</el-table-column>
</el-table>

<el-pagination
	@size-change="handleSizeChange"
	@current-change="handleCurrentChange"
	:current-page="currentPage"
	:page-sizes="[10, 20, 30, 40]"
	:page-size="pageSize"
	layout="total, sizes, prev, pager, next, jumper"
	:total="total">
</el-pagination>

// js部分

data () {
	return {
		tableData: [],	// 只用这个数组来显示
		total: 0,
		currentPage: 1,
		pageSize: 10,
		newTableData: []	// 再重建一个新的数据存储下全部数据
	}
},
methods: {
	handleSizeChange(size) {
		const array = []
		for (let i = 0; i < size; i++) {
			if (this.newTableData[i] == undefined) {
				this.newTableData[i] = 1
			}
			array.push(this.newTableData[i])
		}
		this.tableData = array
		for (let a = 0; a < this.tableData.length; a++) {
			if (this.tableData[a] === 1) {
				this.tableData.splice(a)
			}
		}
	},
	handleCurrentChange(current) {
		const page = current * 10
		const array = []
		for (let i = 0; i < page; i++) {
			if (this.newTableData[i] == undefined) {
				this.newTableData[i] = 1
			}
			array.push(this.newTableData[i])
		}
		this.tableData = array.slice(-10)
		for (let a = 0; a < this.tableData.length; a++) {
			if (this.tableData[a] === 1) {
				this.tableData.splice(a)
			}
		}
	}
}