吐槽:因为naive-ui是基于vue3,所以目前的组件资料是少之又少啊,虽然好用,但感觉没有特别的普及。
背景:记得1年前我第一次碰到了这个问题,在列表里使用:pagination分页,怎么都不显示页码(除了个第1页),当时好像搞了得有2小时才找到办法;然而!然而!!!!1年后的今天又让我遇到了这个问题,因为半年没敲vue3用naive-ui的缘故所以没想起来当时怎么解决的,就又浪费了我1小时的冥想时间........,以此为背景进而发帖,让搬运工们不再浪费摸鱼时间,得到解决!
------------------------------------------------------
重点(加上这个就好了):
remote
数据列表分页全部代码:文章来源:https://www.toymoban.com/news/detail-768376.html
<div class="content_table">
<n-data-table
remote
:columns="columns"
:data="data"
:pagination="paginationRe" />
</div>
const paginationRe = reactive({
page: 1,
pageSize: 10,
pageCount: 2,
showSizePicker: true,
pageSizes: [10, 20, 50],
onChange: (page: number) => {
paginationRe.page = page
},
onUpdatePageSize: (pageSize: number) => {
paginationRe.pageSize = pageSize
paginationRe.page = 1
}
})
有用直接点赞👍!!!文章来源地址https://www.toymoban.com/news/detail-768376.html
到了这里,关于Naive UI数据表格分页pageCount配置没效果的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!