Naive UI数据表格分页pageCount配置没效果

代码搬运工小付2023-10-22 2:00

吐槽：因为naive-ui是基于vue3，所以目前的组件资料是少之又少啊，虽然好用，但感觉没有特别的普及。

背景：记得1年前我第一次碰到了这个问题，在列表里使用:pagination分页，怎么都不显示页码（除了个第1页），当时好像搞了得有2小时才找到办法；然而！然而！！！！1年后的今天又让我遇到了这个问题，因为半年没敲vue3用naive-ui的缘故所以没想起来当时怎么解决的，就又浪费了我1小时的冥想时间........，以此为背景进而发帖，让搬运工们不再浪费摸鱼时间，得到解决！

重点（加上这个就好了）：

html 复制代码

remote

数据列表分页全部代码：

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
  }
})

有用直接点赞👍！！！