请问后台写的分页查询前端怎么调用呢?

    @GetMapping(value = "/search/{currentPage}/{pageSize}")
    @Override
    public Result<PageInfo<T>> findByPage(@PathVariable(name = "currentPage") Integer currentPage,
                                          @PathVariable(name = "pageSize") Integer pageSize) {
        PageInfo<T> pageInfo = coreService.findByPage(currentPage, pageSize);
        return new Result<PageInfo<T>>(true, StatusCode.OK, "分页查询成功", pageInfo);
    }

前端是vue的,

var vue = new Vue({
        el: '#app',
        data: {
            autoUpload: true,//自动上传
            imageUrl: null,//模型数据,用于上传图片完成后图片预览
            activeName: 'first',//添加/编辑窗口Tab标签名称
            pagination: {//分页相关属性
                currentPage: 1,
                pageSize: 10,
                total: 100,
                queryString: null,
            },
            dataList: [],//列表数据
        },
        created() {
            this.findPage();
        },
        methods: {
            //分页查询
            findPage() {
                axios.post('/items/search.do', this.pagination).then(res => {
                    if (res.data.flag) {
                        this.dataList = res.data.data.rows;
                        this.pagination.total = res.data.data.total;
                    } else {
                        this.$message.error(res.data.message);
                    }
                })
            },
}

前端这里该怎么写才能完成将数据调出来?

1.@GetMapping(value = "/search/{currentPage}/{pageSize}")

value就是你调用get请求的url,currentPage和pageSize是你的分页数据,就是pagination里的。

譬如axios.get('/items/search/1/10')
2.也可以调整后端的路径直接value="/search",参数则不用@PathVariable注解就可以得到了

传入当前页,每页查询多少条等参数;

后端会返回总条数,总页数,当前页的数据信息;

后端返回总条数,前端解析获取

 

1.前段传递页数,后端根据页码计算出返回的数据,返回一整页的内容

2.在数据量不大的情况下,后端返回所有结果,前端缓存结果,并分页展示

3.在千万级-亿级数据量情况下,需要针对查询做优化,很多时候并不是用页数去做分页,更多的是用时间分区去查询,这个也需要根据实际分库分表的逻辑去优化

1.后端做分页,接口传入参数一般需要页码,以及页面限制条数

2.后端返回前段,返回总条数和data