爱上BOOK商城
使用技术: Vue.js +Vue-router + Vuex + Vue-cli
项目描述:爱上BOOK是一款线上书城,包括书城主体板块(首页,书架页,详情页,购物车,发现好书等板块),以及另外两大板块,全部采用的组件化开发,我负责书城主体板块部分的实现。
技术描述:
1、使用Vue-cli脚手架搭建项目结构
2、使用elementUI+swiper进行各部件的开发。
3、实现单页面应用,应用Vue-router进行页面的切换,全部采用的组件化,工程化开发,便于后期维护和拓展。
4、对经常需要展示以及在多页面中进行共享的数据采用Vuex来进行状态管理
5、使用localStorage和Vuex对用户登录状态(token)进行保存,同时设置过期时间以及用户选择过期时间设置,每次向后台发生请求时,在拦截器中为请求添加token带着一起去后台进行请求
6、购物车模块分为用户登录与未登录的添加情况,登录则添加用户购物车,通过与后端协商,考虑到直接存数据库持久化会导致读写速度的变慢,存储session会浪费大量服务器内存,且刷新则购物车丢失的情况以及用户现实使用情况,决定使用cookie来进行未登录下的保存,未登录则使用cookie进行未登录状态购物车的保存,待用户登录后进行购物车的合并并清空cookie
7、使用Vue的导航守卫来进行用户的权限校验