refactor: 使用defineModel替换useVModel

This commit is contained in:
ray
2024-09-13 21:55:11 +08:00
parent f8efb238c5
commit 6f63834491

View File

@@ -16,20 +16,12 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
const props = defineProps({ defineProps({
total: { total: {
required: true, required: true,
type: Number as PropType<number>, type: Number as PropType<number>,
default: 0, default: 0,
}, },
page: {
type: Number,
default: 1,
},
limit: {
type: Number,
default: 20,
},
pageSizes: { pageSizes: {
type: Array as PropType<number[]>, type: Array as PropType<number[]>,
default() { default() {
@@ -54,19 +46,25 @@ const props = defineProps({
}, },
}); });
const emit = defineEmits(["pagination", "update:page", "update:limit"]); const emit = defineEmits(["pagination"]);
const currentPage = useVModel(props, "page", emit); const currentPage = defineModel("page", {
type: Number,
const pageSize = useVModel(props, "limit", emit); required: true,
default: 1,
});
const pageSize = defineModel("limit", {
type: Number,
required: true,
default: 10,
});
function handleSizeChange(val: number) { function handleSizeChange(val: number) {
emit("pagination", { page: currentPage, limit: val }); emit("pagination", { page: currentPage.value, limit: val });
} }
function handleCurrentChange(val: number) { function handleCurrentChange(val: number) {
currentPage.value = val; emit("pagination", { page: val, limit: pageSize.value });
emit("pagination", { page: val, limit: props.limit });
} }
</script> </script>