Agile Lite在商城微店类的APP中的应用

nandy007
   2015-07-07 14:36:32发布 0收藏, 7428浏览
WebAPP技术
0

随着微信的发展,各类微店的应用遍地开花,所以这里我们也尝试了开发一个微店类的应用供大家参考。耗时2天开发,算是撸主给自己的一个小作业,通过这次实践也发现了一些bug,一并更新到了Agile Lite 1.1.4 beta版
展现形态:webapp

相关技术:Agile Lite单页模式 + ExMobi服务端接口服务

代码如下,需要自取:
p9line.zip(1.69M 下载次数:598) PS:此示例代码由于使用了ExMobi服务端的接口开发能力(接口开发教程请参考http://edu.exmobi.cn/learn/90E54W8sCqbpT1dc),需要部署到ExMobi管理端才能访问,如果开发调试请导入到MBuilder中,启动tomcat之后通过如下地址访问:
http://{ip}:8001/process/service/p9line/index.html

扫描立即体验(环境真实,请勿支付)

开发要点
1、现有的是一个垂直行业的PC版商城,现在需要移植到手机端展示,也就是我们所说的微店
2、整个商城没有接口,所以使用ExMobi服务端的接口服务(service),使用相关页面抓取类将PC版的商城html页面转成JSON数据格式
3、界面采用Agile Lite框架,使用模板注入技术将接口返回的JSON注入到页面中动态显示
4、开发中遇到最多的问题就是页面的缓存问题,我们知道Agile Lite可以给组件设置data-cache来控制组件再次的时候是重新加载还是显示缓存。在微店应用中,像一些列表数据就需要缓存,而商品信息和购物信息则不需要缓存,所以对data-cache的设置要有清晰的逻辑支撑,避免设置不当带来的逻辑错误。
5、登录状态的记录,应用中长期不使用会导致session失效,这时候对于已经处于需要登录方能访问的页面如果继续操作则会出错,所以,对于用户的登录状态需要做成变量进行监控
6、代码整体风格采用闭包,避免变量冲突


下面是微信里的截图

IMG_0085.PNG  (0.09M  下载次数:245次)

IMG_0084.PNG  (0.23M  下载次数:227次)

IMG_0087.PNG  (0.26M  下载次数:263次)

p9line.png  (0.00M  下载次数:120次)

IMG_0083.PNG  (0.15M  下载次数:234次)

IMG_0086.PNG  (0.10M  下载次数:189次)

IMG_0082.PNG  (0.55M  下载次数:236次)

下载APP
扫码下载栗子社区APP