- 页面结构(H5,CSS3,原生JS)
- 框架(基于Vue脚手架:vue-cli)进行搭建
- 数据请求处理框架(vue-resource或者Axios)
- Vue-Router进行路由处理
- 使用json-server模拟REST API(目前项目使用express)
- 登录
- 注册 (没有实现，点击按钮跳转回登录页面)
- 首页数据的展示
- 产品数据与最新消息的展示
- 商品详情页
- 购物车
- 购物确认银行支付选择
- 购买订单 (排序 ( 高->低 ) )
通过npm安装本地服务第三方依赖模块(需要已安装Node.js)
cd vue-shop
npm install 或 cnpm install(个人比较喜欢使用后者，下载依赖模块速度较快)
npm run dev
- 了解vue - 数据渲染、前端模块化、路由
- 熟悉VueJs的接口功能 - 指令的用法、选项的用法
- 了解vue组件 - 组件的交互
- 了解vue工程化方案 - 单文件组件Webpack测试数据
- vue项目的搭建流程
- 使用Ajax请求后端数据
- 组件的设计与交互
- 路由和子路由(嵌套路由通信)
.
├── build
├── config
├── screenshots
├── src
│ ├── assets
│ │ ├── banks
│ │ ├── images
│ │ └── slideShow
│ ├── components
│ │ ├── base
│ │ │ ├── chooser.vue
│ │ │ ├── counter.vue
│ │ │ ├── datepicker.vue
│ │ │ ├── dialog.vue
│ │ │ ├── multiplyChooser.vue
│ │ │ └── selection.vue
│ │ ├── bankChooser.vue
│ │ ├── checkOrder.vue
│ │ ├── HelloWorld.vue
│ │ ├── layout.vue
│ │ ├── logForm.vue
│ │ ├── regForm.vue
│ │ └── slideShow.vue
│ ├── pages
│ │ ├── detail
│ │ │ ├── analysis.vue
│ │ │ ├── count.vue
│ │ │ ├── forecast.vue
│ │ │ └── publish.vue
│ │ ├── detail.vue
│ │ ├── index.vue
│ │ └── orderList.vue
│ ├── App.vue
│ └── main.js
├── static
│ └── .gitkeep
├── .babelrc
├── .editorconfig
├── .gitgnore
├── .postcssrc.js
├── db.json
├── index.html
├── package.json
└── README.md
.
