u

code/g3soft-libs/docs/examples/pagination/total.vue

@@ -0,0 +1,20 @@
+<script setup lang="ts">
+// showTotal：显示总条数；#showTotal 插槽可拿到 { total, from, to } 自定义文案
+import { ref } from 'vue'
+import { G3Pagination } from '@g3soft/ui'
+
+const current = ref(2)
+const pageSize = ref(10)
+</script>
+
+<template>
+  <div style="display: flex; flex-direction: column; gap: 16px">
+    <G3Pagination v-model:current="current" :total="53" show-total />
+
+    <G3Pagination v-model:current="current" v-model:page-size="pageSize" :total="53" show-total show-size-changer>
+      <template #showTotal="{ total, from, to }">
+        第 {{ from }}-{{ to }} 条 / 共 {{ total }} 条
+      </template>
+    </G3Pagination>
+  </div>
+</template>