单页面 海淘商城
初学vue时曾在网上搜索vue的实战项目源码,无奈大部分都是简单的demo,对于深究vue没有太大的帮助,剩下的一些大部分都是像音乐播放器之类的展示型项目,交互没有预期那么复杂。但我们实际在工作中,经常会遇到有购物车的项目,这类项目因为涉及到money,所以对逻辑严谨度要求高,页面之间交互复杂,又会伴随着登录、注册、用户信息等等,常常会让我们很头疼。
此项目大大小小共 16 个主体页面,涉及注册、登录、商品详情、购物车、下单、订单、订单详情等等,是一个完整的流程。一般公司即便是官网的单页面项目都没这么复杂,如果这个项目能驾驭的了,相信大部分公司的其他单页面应用也就不在话下,即便更复杂,也不会比这个高到哪里去。
注:此项目纯属个人瞎搞,正常购买请选择唯妮海购官网。
vue2 + vuex + vue-router + webpack + ES6/7
该项目所有接口都来自唯妮海购,如有侵权,请联系本胖。马上删除。(商品详情接口最近有很大的变动,故商品详情页的逻辑有一部分是不对的,等新的商品详情接口上线,本胖马上改哈)。
git clone https://github.com/lvpangpang/weinihaigou.git
cd weinihaigou
npm install
npm run dev
如果对您有帮助,您可以点右上角 "Star" 支持一下 谢谢! ^_^
或者您可以 "follow" 一下,我会不断开源更多的有趣的项目
如有问题请直接在 Issues 中提,或者您发现问题并有非常好的解决方案,欢迎 PR 👍
如果您不想注册的可以直接用这个账户 用户名 15757135989 密码 123456
- 登录、注册 -- 完成
- 首页 -- 完成
- 分类 -- 完成
- 搜索 -- 完成
- 搜索结果以及筛选 -- 完成
- 购物车功能 -- 完成
- 商品详情页 -- (等新接口上线马上就改好)
- 商家详情页 -- 完成
- 登录、注册 -- 完成
- 个人中心 -- 完成
- 下单功能 -- 完成
- 订单列表 -- 完成
- 订单详情 -- 完成
- 添加、删除、修改收货地址 -- 完成
- 付款 -- 不过最好不要在这里付款哈