首页 技术 正文
技术 2022年11月8日
0 收藏 365 点赞 1,425 浏览 3617 个字

开始前先聊聊五毛钱的:

  好久没写了,可能是因为懒(哎),写这个是好事,既帮助了自己,巩固一下知识,也可以让别人给自己纠错纠错,三月份接触到了node,先是跟着一些教程写了一些小实例,感觉自己就喜欢上了node,本人呢对于新的东西比较好奇,但由于实习的原因,并不能专心去学习,也就半了解,五月份回学校做毕设,本来要求的是使用C#,给予.net 的,在接触过后,并且做了一些就开始放弃了,个人看法,着实不喜欢使用vs,对于配置问题更是让我头疼,哪有node这么方便,建个文件夹就开始了,比较有动力!

今天也说一下使用mongodb 数据库分页,本人才疏学浅,菜鸟一枚,对于知识点理解不深(按自己的想法来):

先说起因:做一个商品信息列表,商品很多,我们就需要分页,设计的数据库方法:

find()   查询商品,

limit(),     限制显示文档个数

skip();     跳过文档个数,

本人实现方法比较笨,具体看代码:

首先,得知道商品的总数,查询数据库:

cart:function cart(userId){
return Cart.find({userId:userId,isBuy:1})
.exec()
}

再者,首次访问时,并没有点击底下的分页按钮,就得来个初始化吧,这样: pageSize :单页显示的文档数

findCart:function findCart(userId,pageSize){
return Cart.find({userId:userId,isBuy:1})
.limit(pageSize)
.exec()
},

下来就是分页的了:   Count:需要跳过的文档数,他的构成  点击的页 (num-1)*pageSize

findGoodsOrder:function findGoodsOrder(userId,pageSize,Count){
return Cart.find({userId:userId,isBuy:2})
.limit(pageSize)
.skip(Count)
.exec()
}

好了,数据库这一块就好了,再看路由处理:

当然这就是首次访问了:  将需要分的页数一块传值过去,page变量,需要构造一页面:

router.get('/cart',function(req,res,next){
var pagesSize = 4;
Promise.all([
CartModel.findCart(req.session.user._id),
CartModel.cart(req.session.user._id)
])
.then(function(result){
if(!result){
req.flash('error','出错了!');
}
var goods = result[0];
var page = Math.ceil(result[1].length/4);
req.flash('success','查找成功!');
//req.session.user.credit = parseInt(user.SecPayment);
res.render('per-cart',{
goods:goods,
page:page
});
})
.catch(next);
});

然后就是分页请求处理了:传过来的值为点击的页数码,公式,算出需要跳过几个文档数,调用函数就行了,

*注意,这次往回传的时候是,res.send();说明我们用了ajax,局部刷新页面:

  先想一想,怎么处理??再看下面。。。。

router.get('/cart/page',function(req,res,next){
var pageSize=4;
var page = (parseInt(req.query.count)-1)*4;
CartModel.findGoodsOrder(req.session.user._id,pageSize,page)
.then(function(goods){
if(!goods){
req.flash('error','出错了!');
}
req.flash('success','查找成功!');
//req.session.user.credit = parseInt(user.SecPayment);
res.send({
goods:goods
});
})
.catch(next);
});

最后,我们就转到页面层了,:

页面构造就不细说了,直接看ajax部分:

page:function(){
/**数据实现分页
* 可累死了,首先不知道如何获取点击对象的文本节点值,
* 对于ajax get/post 没有理解,
* 返回的数据处理方式,
* @type {any|jQuery|HTMLElement}
*/
var pageNum = $('.page li'); //获取页码对象
pageNum.click(function(){ //单击事件,并将这个点击对象传过去
page(this);
});
function page(obj){ //事件处理函数
for(var i =0;i<pageNum.length;i++){
pageNum[i].style.backgroundColor = '#fff'; //默认页码背景色白色
}
obj.style.backgroundColor = '#f00'; //单击对象背景色为红色
var count = obj.firstChild.nodeValue; //获取单机对象的文本节点值,
                                       //对于DOM操作没有好的理解,费好大劲,哎,技渣
$.ajax({ //ajax请求
type:'GET',
url:'/personal/order/page',
data:{
count:count
},
dataType:'json', //请求的是后台,数据类型必须设置成JSON,
success:function(data){ //不知道还能设置成其他的值不,还不清楚,
//alert('成功:'+data.data);
var goods=data.goods; //获取返回的数据,就是动态添加HTML了,
var cart = $('.cartshow');
//alert(goods[0].nodeName);
//goods[0].innerHTML='hello'
var content='<ul>';
goods.forEach(function(goods){
content+=
' <li><input type="checkbox" value="'+goods.count*goods.onePrice+'"/></li>'+
'<li><a href="/main/'+goods.goodsId+'/single" rel="external nofollow" >'+goods.gName+'</a></li>'+
'<li class="bigshow">'+
'<div>'+
'<img src="/images/45.jpg">'+
'<div>'+
'<label>'+goods.describe+'</label>'+
'<label>尺寸'+goods.size+'</label>'+
'</div></div></li>'+
'<li>'+goods.count+'</li>'+
'<li>'+goods.onePrice+'</li>'+
'<li>'+goods.count*goods.onePrice+'</li>'+
'<li><a href="/singleGoods/'+goods.goodsId+'/2/remove" rel="external nofollow" >删除</a></li>';
});
content+='</ul>'
cart[0].innerHTML = content;
lb.price();
},
error: function(jqXHR, textStatus, errorThrown){
alert('error ' + textStatus + " " + errorThrown);
}
});
}
}

大概的分页就是这样了,为什么要写,因为我遇到这个问题的时候,本来想网上一找,就算了,谁知道呢,哎,难,都是是一个模板,不知道谁拷谁的,对于新手完全看不懂,然后就放弃了,当时对于ajax也不怎么熟悉,查书,找同学讨论,可怜,周围的居然没有一个学习nodeJS的,讨论一些逻辑部分,给自己找找灵感,

大概就是一天的时间,大概是我放了大招(使用代码量能解决的问题,就不是问题),初步实现了功能。

代码还有待扩展,如果数据特别多,底下的分页码就特别多,这需要一个处理,多的省略号,周围的五个存在,如:1 …9 10 11 12 13 .. 20

这又是一个问题,哎!想想头都大,但目前我先不做这个,以后再考虑吧,下来的工作是一个实时交互功能,论坛聊天那种,给自己加油!

有什么问题,欢迎吐糟,共同进步!

<h2>现阶段目标:能用代码量解决的问题,就不是问题!</h2>

相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:9,077
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,552
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,401
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,176
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:7,813
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:4,896