el-pagination 的默认每页显示数量是 12怎么编码
时间: 2024-10-11 07:06:06 浏览: 6
在Element UI中,`el-pagination` 组件的默认每页显示数量是10条数据。如果你需要将每页显示的数量设置为12条,可以通过设置 `page-size` 属性来实现。以下是具体的编码示例:
```html
<template>
<div>
<el-pagination
:total="totalRows"
:current-page="currentPage"
:page-size="12"
layout="total, sizes, prev, pager, next, jumper"
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
></el-pagination>
</div>
</template>
<script>
export default {
data() {
return {
totalRows: 100, // 总数据条数
currentPage: 1, // 当前页码
};
},
methods: {
handleCurrentChange(page) {
// 切换页码逻辑...
this.currentPage = page;
// 重新加载数据...
},
handleSizeChange(size) {
// 改变每页显示数量逻辑...
console.log('每页显示数量:', size);
// 重新加载数据...
},
},
};
</script>
```
在这个例子中,我们通过设置 `:page-size="12"` 来指定每页显示12条数据。同时,`layout` 属性用于定义分页组件的布局,包含总条目数、可选择的每页条目数、前后页按钮等。
阅读全文