ant design vue实现分页

如果我们是table分页,需要设置一下这个属性:

:pagination="false"

我们不用table自带的分页。

实现思路:

在data里面定义

data() {

    return {

        total:0,

        pageIndex:1,

        pageSize:10

    }

}

分页必要参数有:total(总数,需要后台提供,再给你的list赋值的时候给total赋值即可)、pageSize(每页显示的条数)、pageIndex(当前页码),

<a-pagination :pageSize='pageSize' v-model="pageIndex" @change="pageChange" :total="total" show-less-items />

在pageChange函数里面,给当前页赋值,并且去执行查询列表函数

pageChange(current){

        this.pageIndex=current;

        this.getList();//给当前页赋值之后,自然是要去查询

}

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容