Ant Design Vue中的table与pagination的联合使用

本文主要是介绍Ant Design Vue中的table与pagination的联合使用，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

效果： 

代码：

<a-table:dataSource="dataSource":columns="columns":pagination="pagination"@change="handleTableChange":scroll="{ x: '100%', y: 600 }">
</a-table>

export default defineComponent({setup() {const current = ref(1);const pageSize = ref(10);const pagination = computed(() => ({current: current.value,pageSize: pageSize.value,total: 30,showTotal: (total) => `共 ${total} 条`,pageSizeOptions: ["5", "10", "15"],showSizeChanger: true,}));const handleTableChange = (pag, filters, sorter) => {current.value = pag.current;pageSize.value = pag.pageSize;};return {pagination,handleTableChange,};},
});

 

这篇关于Ant Design Vue中的table与pagination的联合使用的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---