基于Vue开发的电商APP项目——蘑菇街app

项目源码:https://github.com/Limna777/Shopmall.git

接口私聊

1、项目描述

  • 项目技术栈Vue2.0 + vuex + vue-router + ES6 + webpack + axios
  • 项目采用模块化、组件化、工程化的模式开发
  • 项目分为四大基本模块:首页 + 分类 + 购物车 + 我的

2、使用的插件或第三方库

  • 使用 vue-router 开发单页面
  • 使用 vuex 管理应用组件的状态
  • 使用 vue-lazyload 实现图片的懒加载
  • 使用 axios 的封装从后端拿取数据使用 less 写部分组件的样式
  • 使用 better-scroll 实现移动端页面滑动效果

3、页面主要实现的功能

1、首页
  • 首页轮播图的展示
  • 首页局部商品分类应用的切换
2、应用分类
  • 头部nav-bar可跳转到搜索页面
  • 左侧遍历数据库的第三级分类进行展示
  • 右侧对左侧标题的选择进行对应加载、显示
  • 可点击右侧对应展示的商品跳转到详情页面
3、购物车
  • 用户可在详情页进行商品的购物车加购
  • 商品的全选功能
4、个人中心
  • 利用组件化完成基本页面的布局

4、基本目录

|
|—— build
|—— config
|——src : dev resources.
| |—— assets/
| | |css
| | |images
| |—— public/ 公共组件
| | |
BottomNav.vue
| | |
SearchBar.vue
| | |____ TabBar.vue
| | |____ sidebar.vue
| |—— page
| | |____ cart
| | |____ category
| | |____ good
| | |____ mainframe
| | |____ mine
| |—— router/
| | |____ index.js 路由映射
| |—— store/
| | |____ store.js
| |—— App.vue :neteast-yanxuan SPA
| |__ main.js : the entry of douban-movieSPA
|
|__ static : static files

5、项目截图

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

©️2020 CSDN 皮肤主题: 1024 设计师:上身试试 返回首页