Vue3 Element Plus 分页组件不显示:排查指南
"在使用Vue3的时候,如果需要使用el-pagination组件进行分页,确保已经安装了element-plus插件,并且正确引用了它。请确保已经正确安装element-plus插件,并在需要使用分页的组件中引入el-pagination组件。\n\nvue\n<template>\n <div class="paginationBox">\n <el-pagination\n @size-change="handleSizeChange"\n @current-change="handleCurrentChange"\n :current-page="currentPage"\n :page-sizes="[20, 40, 60, 80, 100]"\n :page-size="pageSize"\n layout="total, jumper, prev, pager, next, sizes"\n :total="total"\n popper-class="label-popper"\n ></el-pagination>\n </div>\n</template>\n\n<script>\nimport { ref } from 'vue';\nimport { ElPagination } from 'element-plus';\n\nexport default {\n components: {\n ElPagination,\n },\n setup() {\n const currentPage = ref(1);\n const pageSize = ref(20);\n const total = ref(1000);\n\n const handleSizeChange = (val) => {\n pageSize.value = val;\n };\n\n const handleCurrentChange = (val) => {\n currentPage.value = val;\n };\n\n return {\n currentPage,\n pageSize,\n total,\n handleSizeChange,\n handleCurrentChange,\n };\n },\n};\n</script>\n\n\n请确保已正确导入并注册了ElPagination组件,并且handleSizeChange和handleCurrentChange方法已正确定义。如果问题仍然存在,请检查控制台是否有任何错误信息,以便进一步排查问题。
原文地址: https://www.cveoy.top/t/topic/p9QW 著作权归作者所有。请勿转载和采集!