博客项目——分页功能实现

服务器路由代码（userPage.js）

将page（客户端以get方式传递的当前页数）和total（服务器从数据库获取并计算出的总页数）数据引入模板

//引入用户模板
const { User } = require('../../model/user');
module.exports = async (req, res) => {
     //获取用户当前页数page ,用户未窜入page默认显示第一页数据
    let page = req.query.page || 1;
    // //给页面指定页数
    let pagesize = 10;
    let count = await User.countDocuments({});
    //total存放用户总页数
    let total = Math.ceil(count / pagesize); 
    // res.render('admin/user', { mes: req.username });
    //查找所有用户信息,limit限制显示10个,skip表示跳过start从start+1开始展示
    let start = (page - 1) * 10;
    let users = await User.find({}).limit(10).skip(start);
    //将用户信息渲染到模板里
    res.render('admin/user', {
        users: users,
        //通过从客户顿发送的page参数以及服务器计算的total来渲染模板
        page: page,
        total:total
    });
    
}
           

用户展示模板核心代码（user.art）

<!-- 分页 -->
        <ul class="pagination">
            <!-- 当前页面-1是否<1,小于则说明当前是第一页，不显示<< -->
            <li style="display: <%= page-1<1 ? 'none': 'inline' %>">
                <a href="/admin/user?page=<%=page-1%>">
                    <span>&laquo;</span>
                </a>
            </li>
            <!-- 利用循环生成页面链接,不同的链接通向统一页面的不同参数 =号含义是输出-->
            <%for(var i=1;i<=total;i++) {%>
            <li><a href="/admin/user?page=<%=i%>"><%=i%></a></li>
            <% }%>
             <!-- 当前页面+1是否>total(最后一页),大于则说明当前是最后一页，不显示>> -->
            <li style="display: <%= page-0+1>total ? 'none': 'inline' %>">
                <a href="/admin/user?page=<%=page-0+1%>">
                    <span>&raquo;</span>
                </a>
            </li>
        </ul>
        <!-- /分页 -->
           

注意

<!-- 当前页面+1是否>total(最后一页),大于则说明当前是最后一页，不显示>> -->
            <li style="display: <%= page-0+1>total ? 'none': 'inline' %>">
                <a href="/admin/user?page=<%=page-0+1%>">
                    <span>&raquo;</span>
                </a>
            </li>
           

用原始语法循环生成页码，<%=i%>当需要有输出的时候不要忘了等号。第一个page是参数，第二个page是变量。注意减号有隐式类型转化，加号没有会显示11，采用-0的方式解决