NodeJs分页(一)

  最近在用NodeJs做后台管理系统时,分页功能真是浪费了我不少时间啊!第一次写,在网上查阅了一番,发现介绍都不是很详细,也不是我想要的结果!理清了思路之后,终于完成了我想要的分页样式!上效果图!
分页
  首先看我的ejs分页代码

    <div class="mainPaging">
        <ul>
            <li class="pagingLi"><a href="/admin/user?page=1">首页</a></li>
            <li class="pagingLi"><a href="/admin/user?page=<%=page-1<1?1:page-1%>">上一页</a></li>
            <% if(page>1){%>
                <li class="pagingLi" ><a href="/admin/user?page=<%=page-1%>"><%=page-1%></a></li>
            <%} %>
            <li class="pagingLi" style="background:skyblue;"><a href="/admin/user?page=<%=page%>"><%=page%></a></li>
            <%if(page<pages){%>
            <li class="pagingLi"><a href="/admin/user?page=<%=page+1%>"><%=page+1%></a></li>
            <%}%>
            <li class="pagingLi"><a href="/admin/user?page=<%=page+1>pages?pages:page+1%>">下一页</a></li>
            <li class="pagingLi"><a href="/admin/user?page=<%=pages%>">尾页</a></li>
        </ul>
    </div>

  css样式

            /*分页*/
        .mainPaging{
            width: 400px;
            text-align: center;
            overflow: hidden;
            margin: 0 auto;
        }
        .mainPaging ul{
            margin: 0;
            padding: 0;
        }
        .pagingLi{
            width: 55px;
            height: 30px;
            line-height: 30px;
            list-style: none;
            float: left;
            cursor: pointer;
            border: 1px solid #e7eaec;
            margin-bottom: 10px;
        }
        .pagingLi a{
            text-decoration: none;
        }

  下面让我们重点介绍一下NodeJs的代码!
  下面是我们的路由!

router.get("/",function (req,res,next) {
    DB.find("adminuser",{},function (err,data) {
        var page=Number(req.query.page)||1 //当前页,前端用户通过get传递过来的页数,或没有传递时默认当前页数为1;
        var limit=2//每页显示的条数;
        //获取总条数;
        const count=data.length;
        //计算总页数;
        var pages=Math.ceil(count/limit)
        //当前页不能大于总页数;
        page=Math.min(page,pages)
        //当前页不能小于1
        page=Math.max(page,1);
        var skip=(page-1)*limit;//忽略数
        DB.count("adminuser",{},limit,skip,function(error,data){
            res.render('admin/user/user',{
                list:data,//把查找到的数据以数组的形式返回到页面
                page:page,//当前页
                pages:pages,//总页数
            })
        })
    })
});

注意: DB是我封装的对数据库的操作方法,find()则是我封装的一个查找数据的方法。count()是我封装的限制显示数据的方法,即以分页的形式显示。
  下面看具体代码!

const MongoClient=require("mongodb").MongoClient;
const DbUrl='你的数据库地址';
const dbName = '你要连接的数据库表';
//连接数据库的封装方法
function connectDb(callback) {
    MongoClient.connect(DbUrl,function (err,client) {
        if(err){
            console.log(err);
            return;
        }
        const db = client.db(dbName);

        callback(db);
        client.close();
    })
}
// 查询数据
exports.find=function (collectionname,json,callback) {
    connectDb(function (db) {
        const result=db.collection(collectionname).find(json);
        result.toArray(function (error,data) {
            callback(error,data);
        })
    });
};
// 分页查找数据
exports.count=function (collectionname,json,limit,skip,callback) {
    connectDb(function (db) {
        const result=db.collection(collectionname).find(json).limit(limit).skip(skip)
        result.toArray(function (error,data) {
            callback(error,data);
        })
    });
};

  以上就是我的见解,与大家共享!

发布了60 篇原创文章 · 获赞 9 · 访问量 2426

猜你喜欢

转载自blog.csdn.net/qq_43692768/article/details/103150519
今日推荐