分页查询有数据无数据源问题

使用前端查询有数据但无数据源问题

问题详情

表格有自带的分页功能，后台分页主要是通过传｛limit:10,page:1表示当前页数为第1页，每页显示10条数据，两个参数来控制分页的分页查询。假设当前有三十条数据，则初始化表格时，显示3页，总数30，页数为1,数据源为1-10条数据。当我们添加查询条件时，假设我通过模糊查询“汪” 能在30条数据中查询到10条数据，当前页数为第一页，查询的数据进行分页{limit:10,page:1}
10条数据取1-15条之内的，数据源也就是10条数据。此时我们把页数切换到第二页时，再通过相同的查询条件去查询，查询数据还是为10条，分页传的{limit:10,page:2},10条数据取16-30之间的数据，然而总数据只有10条，行号在16-30之间无数据，虽然可以看到数据的总数为10，但是没有数据源，前台显示无数据,无数据也就无法初始化下方的分页栏。为了保证能够查询数据，在点击查询按钮时，自动将页数指定为第一页。
继续你的创作。

具体问题演示

代码演示

        //查询操作按钮点击事件
        $("#searchBtn").click(function () {
            //页码页号设置在后端，有具体对象
            //page=1,limlt=10
            //以下是提交具体参数
            let name = $("#name").val();
            let phone = $("#phone").val();
            let address = $("#address").val();
            tabIns.reload({
                where: {
                    "name": name,
                    "phone": phone,
                    "address": address
                }
            })
        });

这样就出现上述问题，当点击第二页，然后查询时
{page=1,limit=10,name,phone,address}就变成
{page=2,limit=10,name,phone,address}

解决办法

//按钮查询
        $("#searchBtn").click(function () {
            let name = $("#name").val();
            let phone = $("#phone").val();
            let address = $("#address").val();
            let page=1;//强制把page改为1
            tabIns.reload({
                where: {
                    "page":page,//参数引用
                    "name": name,
                    "phone": phone,
                    "address": address

                }
            })
        });

这样每次查询都是传递：
{page=1,limit=10,name,phone,address}
这样就解决啦问题！！

以上内容纯属参考，部分引用，如有侵权，请联系422117362@qq.com.