26 lines
756 B
Vue
26 lines
756 B
Vue
<script setup lang="ts">
|
||
// showSizeChanger：每页条数下拉；pageSizeOptions 自定义选项，showSizeChange 单独通知
|
||
import { ref } from 'vue'
|
||
import { G3Pagination } from '@g3soft/ui'
|
||
|
||
const current = ref(1)
|
||
const pageSize = ref(20)
|
||
const lastEvent = ref('暂无')
|
||
</script>
|
||
|
||
<template>
|
||
<div>
|
||
<G3Pagination
|
||
v-model:current="current"
|
||
v-model:page-size="pageSize"
|
||
:total="286"
|
||
:page-size-options="[10, 20, 50, 100]"
|
||
show-size-changer
|
||
@show-size-change="(page: number, size: number) => (lastEvent = `切换每页 ${size} 条，当前第 ${page} 页`)"
|
||
/>
|
||
<p style="margin: 8px 0 0; font-size: 13px; color: #6b7280">
|
||
每页 {{ pageSize }} 条｜{{ lastEvent }}
|
||
</p>
|
||
</div>
|
||
</template>
|