node.js express 上线(node+express实现分页效果)
类别:编程学习 浏览量:792
时间:2021-10-19 06:39:12 node.js express 上线
node+express实现分页效果本文实例为大家分享了node+express实现分页效果展示的具体代码,供大家参考,具体内容如下
效果如下
1、 index.js
在index.js
//数据列表传前台+分页的实现 router.get('/admin', function(req, res, next) { var count = 0; var page = 0; var size = 5; //页码 var pagenum = req.query.pagenum; var pagenum = pagenum?pagenum:1; mongo.connect(url1,function(err,database){ database.collection("list",function(err,coll){ //异步处理 async.series([ function(callback){ coll.find({}).toArray(function(err,data){ count = data.length;//数据条数 //page = page<1? 1:page; page = Math.ceil(count/size);//总共的页数 pagenum = pagenum<1?1:pagenum;//页码小于1;显示1 pagenum = pagenum>page?page:pagenum;//页码大于总页数;显示总页数 callback(null,'') }) },function(callback){ coll.find().sort({_id:-1}).limit(size).skip((pagenum-1)*size).toArray(function(err,data){ callback(null,data) }) } ],function(err,data){ res.render('admin',{list:data[1],page:page,count:count,pagenum:pagenum,size:size,name:req.session.name}) database.close() }) // coll.find({}).toArray(function(err,data){ // res.render('admin', {list:data});//前端admin页面可用直接list // database.close() // }) }) }) });
2、所渲染的页面
<!-- 从数据库获取的数据展示 --> <tbody id="tbody"> <% list.map(function(item,i){ %> <tr> <td><%- i+1 %></td> <td><%- item.name %></td> <td><%- item.nicheng %></td> <td><%- item.time %></td> <td><%- item.pass %></td> <td class="text-center"> <li class="layui-btn-group"> <button class="btn btn-primary btn-xs change" data-toggle="modal" data-target="#myModal2" dw-url="create.html?id=1" dw-title="编辑用户"> <i class="layui-icon"></i>编辑 </button> <button class="btn btn-danger btn-xs dw-delete delate" > <i class="layui-icon"></i>删除 </button> </li> </td> </tr> <tr> <% }) %> </tbody> <!-- 分页处理 --> <li class="am-cf"> <li class="am-active" style="margin-top: 20px"> <span style="font-size:20px">第 <%-pagenum%> 页</span> </li> <li aria-label="Page navigation" style="margin-left:600px"> <ul class="pagination"> <li class="am-disabled"> <a href="/admin?pagenum=<%-pagenum<1?1:parseInt(pagenum)-1 %>" >«</a> </li> <% if(page>5){%> <li class="am-active"> <a href="/admin?pagenum=1">1</a> </li> <li class="am-active"> <a href="/admin?pagenum=2">2</a> </li> <li class="am-active"> <a href="#" >...</a> </li> <li class="am-active"> <a href="/admin?pagenum=<%-page-1 %>"><%-page-1 %></a> </li> <li class="am-active"> <a href="/admin?pagenum=<%-page %>"><%-page %></a> </li> <% }else{%> <% for(let i = 0;i<page;i++){ %> <li class="am-active"> <a href="/admin?pagenum=<%-i+1 %>"><%-i+1 %></a> </li> <% } %> <% } %> <li> <a href="/admin?pagenum=<%-pagenum>page?page:parseInt(pagenum)+1%>" >»</a> </li> </ul> </li> </li>>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持开心学习网。
您可能感兴趣
- node.js怎么使用import(Node.js断点续传的实现)
- html元素和属性的区别(HTML5 HTMLCollection和NodeList的区别详解)
- nodejs格式化教程(nodejs利用readline提示输入内容实例代码)
- nodejs的广播机制(node.js如何自定义实现一个EventEmitter)
- nodejs八种命令(详细谈谈NodeJS进程是如何退出的)
- node中使用token(浅谈node使用jwt生成的token应该存在哪里)
- nodejs实现websocket服务端(Node.js+express+socket实现在线实时多人聊天室)
- docker怎么部署node-exporter(Docker搭建部署Node项目的方法步骤)
- nodejs请求页面(node.js+postman实现模拟HTTP服务器与客户端交互)
- node.js缓存区(如何利用node实现静态文件缓存详解)
- nodejs部署上传文件(node.js使用express-fileupload中间件实现文件上传)
- html5本地存储功能(利用Node实现HTML5离线存储的方法)
- nodejs子进程调试(Node.js实现断点续传)
- nodejs启动web服务器(使用NODE.JS创建一个WEBSERVER服务器的步骤)
- nodejs游戏服务端框架(如何写Node.JS版本小游戏)
- linux更改inode(详解Linux索引节点inode)
- 四月新番CP人气榜公布,《剃须》两度上榜,沙优不是女朋友(四月新番CP人气榜公布)
- 2019年外媒秋季新番动画角色CP排行榜,桐人和爱丽丝落榜(2019年外媒秋季新番动画角色CP排行榜)
- 新一小兰领衔 盘点动漫中的那些 远距离恋爱情侣(盘点动漫中的那些)
- 大事件 合肥四中火了(大事件合肥四中火了)
- 翼龙贷组织出借人调研 感受鄱阳 借 来的致富路(翼龙贷组织出借人调研)
- 2023新国风戏曲教育寒假集训班汇报演出《戏娃闹元宵》图文报道(2023新国风戏曲教育寒假集训班汇报演出戏娃闹元宵图文报道)
热门推荐
- eval在python里面什么意思(python 为什么说eval要慎用)
- dedecms调用内容(DEDECMS文章列表页调用tag的修改方法)
- 织梦dedecms教程(详解各种dedeCMS织梦后台登陆验证码错误或不显示解决方法大全)
- vueelementui组件生成页面(Vue Element前端应用开发之树列表组件)
- ASP.NET生成静态页面的方法
- linuxrabbitmq安装和使用教程(用docker部署RabbitMQ环境的详细介绍)
- mysql给字段加默认值(MySQL 如何处理隐式默认值)
- 微信小程序scrollview 截图(微信小程序scroll-view不能左右滑动问题的解决方法)
- 测试用例写哪些方面
- python找出数组的最大值(Python查找数组中数值和下标相等的元素示例二分查找)
排行榜
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9