vue3+element Plus实现表格前端分页

每一处都写了注释，还是很容易看懂的

import { defineComponent, reactive, toRefs } from "vue";export default defineComponent({name: "HomeView",components: {},setup() {//表格的全数据（这里是自定义的列表，要看分页效果自行往此数组内加数据）const allTableData = [{date: "2016-05-03",name: "Tom",address: "No. 189, Grove St, Los Angeles",},{date: "2016-05-02",name: "Tom",address: "No. 189, Grove St, Los Angeles",},{date: "2016-05-04",name: "Tom",address: "No. 189, Grove St, Los Angeles",},{date: "2016-05-01",name: "Tom",address: "No. 189, Grove St, Los Angeles",},];//表格用到的参数const state = reactive({page: 1,limit: 10,total: allTableData.length,});//前端限制分页（tableData为当前展示页表格）const tableData = () => {return allTableData.filter((item, index) =>index = state.limit * (state.page - 1));};//改变页码const handleCurrentChange = (e) => {state.page = e;};//改变页数限制const handleSizeChange = (e) => {state.limit = e;};return {allTableData,tableData,handleCurrentChange,handleSizeChange,...toRefs(state),};},});