Vue3 饿了么Plus 插件:el-pagination 分页组件使用指南
"Vue3 饿了么Plus 插件:el-pagination 分页组件使用指南"\n\n安装饿了么Plus插件后,el-pagination分页插件已经包含在其中,可以直接在项目中使用,无需单独引用。只需要在代码中正确使用el-pagination组件即可实现分页功能。\n\n例如:\n\nhtml\n<template>\n <div>\n <el-pagination\n @current-change=\"handleCurrentChange\"\n :current-page=\"currentPage\"\n :page-sizes=\"[10, 20, 30, 40]\"\n :page-size=\"pageSize\"\n :total=\"total\"\n layout=\"total, sizes, prev, pager, next, jumper\"\n ></el-pagination>\n </div>\n</template>\n\n<script>\nexport default {\n data() {\n return {\n currentPage: 1,\n pageSize: 10,\n total: 100,\n };\n },\n methods: {\n handleCurrentChange(val) {\n this.currentPage = val;\n // 根据当前页码获取数据\n // ...\n },\n },\n};\n</script>\n\n\n注意:上述代码中的el-pagination组件需要在使用之前确保el-plus已经正确安装和引入到项目中。
原文地址: https://www.cveoy.top/t/topic/p9RO 著作权归作者所有。请勿转载和采集!