[JavaScript知识库]使用ant-design-vue分页时报错：[Vue warn]: Invalid prop: custom validator check failed for prop “pagination“

ant-design-vue项目中使用Pagination 分页还是比较常用的，经常在list列表或者table表格中使用到
使用过程中可能会遇到的问题：
1.动态赋值total时，会出现下图错误；现象：取决于你后端请求是否有数据，有数据（不会报错），否则会报错
控制台报错信息：

解决办法

// 向后台发起请求
 getAction(url, params).then((res) => {
        if (res.success) {
          console.log(res.result)
          this.listData = res.result.records
          //当后端没有数据时，控制台打印，发现total是undefined会报pagination插值错误
          if (this.listData) {//解决：判断有数据才给total赋值
            this.pagination.total = res.result.total
          }
        } else {
          this.$message.error(res.message)
        }
        this.loading = false
      }).finally(() => {
        this.loading = false
      })

2.onShowSizeChange：pageSize 变化的回调，切换每页显示多少条后，当前页无法回到第一页

//原因：升级antd版本，原来的pageNo已被舍弃改用了current
data(){
     return {
     /* 分页参数 */
       pagination: {
        size: "small",
        current: 1,
        pageSize: 4,
        total: 0,
        showQuickJumper: true,//是否可以快速跳转至某页
        pageSizeOptions: ["4", "6", "10"],//指定每页可以显示多少条
        showSizeChanger: true,//是否可以改变 pageSize
        showTotal: (total, range) => {//用于显示数据总量和当前数据顺序
          return " 共" + total + "条"
        },
        onShowSizeChange: (current, pageSize) => this.onSizeChange(current, pageSize),
        onChange:(page,pageSize)=> this.onPageChange(page, pageSize)
        },
      }
  },
methods: {
 	 //页码改变的回调，参数是改变后的页码及每页条数
    onPageChange(page, pageSize) {
      this.pagination.current = page
      this.loadData()//数据信息列表
    },
    //pageSize 变化的回调
    onSizeChange(current, pageSize) {
      this.pagination.current = 1
      this.pagination.pageSize = pageSize
      this.loadData()
    },
}

最后，放一张效果图吧