Vue3+antd实现分页功能

1.html中代码（在对应的地方添加）

 <a-pagination 
                    v-model:current="current" 
                    :total="total" 
                    v-model:page-size="pageSize"
                    :showSizeChanger="false"
                    :hideOnSinglePage="true"
                    style="margin-top: 20px;text-align: right;"
                    @change="checkTotal"/>

2.在script中定义参数

const current = ref(1);//默认展示第几页
const total = ref(0);//总的条数
const pageSize = ref(10);//默认一页展示的条数
const userList = ref([]);//数据得list

3.翻页的change事件

（getUserPageList是后端接口，具体传的参数根绝接口要求而定，翻页之后再给userList赋值即可）

const checkTotal = (page, pageSize) =>{getUserPageList({current:page,size:pageSize}).then((result)=>{
            userList.value = result.records
            total.value = result.total
        })
      }

希望对你们有帮助！！