最近要涉及微信移动端项目,所以尝试学习一些移动端的实用技能,这个demo服务由Node搭建服务、下拉加载使用插件dropload,数据渲染应用了ES6中的模板字符串。有兴趣的小伙伴可以自己尝试下。
1.Node+express -- 服务搭建
由于该demo是在服务器端实现,所以需要通过npm包引入express模块,用来搭建简易服务。
1.官网下载node,npm包管理工具会同时自动下载。
2.命令行输入:npm install express -g //安装express模块
3.在项目中新建server.js //起服务
代码部分
require("express")().get("*",function(req,res){
res.sendFile(__dirname + req.path);
}).listen(8888,function(){//访问demo的端口为8888
console.log(" 服务已启动")
})
//这样,一个简易的浏览器端服务就搭建起来了。
2.新建文件保存数据--count.json
在项目目录下面建立一个data文件夹,里面新建一个count.json(名字可任意起)
代码部分
[{
"month":"3月","record":[
{
"action":"充值","pay":"12546.00","balance":"3445.00","time":"2015-03-15 15:03"
},.........//这里省略了部分数据
{
"action":"充值","pay":"2546.00","balance":"3444.00",{
"action":"充值","pay":"3546.00","balance":"343.00",{
"action":"腾讯游戏","pay":"1846.00","balance":"344.00","time":"2015-03-15 15:03"
}
]
},{
"month":"4月","pay":"88888.00",..........//省略数据
{
"action":"充值","pay":"99999.00","pay":"354346.00","pay":"18463242.00","time":"2015-03-15 15:03"
}
]
},{
"month":"5月","pay":"2323232.00","pay":"324234.00","time":"2015-03-15 15:03"
}
]
}
]
//该文件中的数据,就是即将渲染在页面中的数据