基于 vue-cli 脚手架 + vue 仿饿了么的webapp，路由 vue-router 实现，服务端数据请求选用 axios 实现，页面滚动 better-scroll 实现。
为了更好的体验，请用开发者工具模拟移动端体验
扫二维码在手机上查看
效果更好
服务器身在国外，网络可能会有波动
- Vue.js
- vue-cli 脚手架搭建项目
- vue-router 实现路由切换
- axios 进行数据请求
- webpack 打包项目文件
- ES6 + ESlint
- flex 弹性布局
- SCSS 编写样式
- Vue 过渡动画
- 联动滚动借助了 better-scroll 插件
- localStorage 本地数据存取
- Goods、Ratings、Seller 组件视图均可上下滚动
- 商品页 点击左侧menu，右侧list对应跳转到相应位置
- 点击list查看商品详情页，父子组件的通信
- 评论内容可以筛选查看
- 购物车组件，包括添加删除商品及动效，购物控件与购物车组件之间为兄弟组件通信，点击购物车图标，展示已选择的商品列表
- 商家实景图片可以左右滑动
- loaclStorage 缓存商家信息（id、name）
├──app.vue
│ ├──header.vue--头部组件
│ │ ├──star.vue--星星评分组件
│ ├──goods.vue--商品组件
│ │ ├──shopcart.vue--购物车组件,包括小球飞入购物车动画
│ │ ├──cartcontrol.vue--购买加减图标控件--选中数量返回给父组件goods，goods响应后，重新计算选中数量，将数据发送给购物车组件，
│ │ ├──food.vue--商品详情页
│ │ │ ├──ratingselect.vue--评价内容筛选组件
│ ├──ratings.vue--评论组件
│ │ ├──ratingselect.vue--评价内容筛选组件
│ ├──seller.vue--商家组件
独立组件
├──split.vue--关于分割线组件
common/---- 文件夹存放的是通用的css和fonts
components/---- 文件夹用来存放 Vue 组件
router/---- 文件夹存放的是vue-router相关配置（linkActiveClass,routes注册组件路由）
build/---- 文件是 webpack 的打包编译配置文件
config/---- 文件夹存放的是一些配置项，比如我们服务器访问的端口配置等
dist/---- 该文件夹一开始是不存在，在项目经过 build 之后才会生成
prod.server.js---- 该文件是测试是模拟的服务器配置，用来运行dist里面的文件，在config/index.js中,build对象中添加一条端口设置port：9000，
App.vue---- 根组件，所有的子组件都将在这里被引用
index.html---- 整个项目的入口文件，将会引用我们的根组件 App.vue
main.js---- 入口文件的 js 逻辑，在 webpack 打包之后将被注入到 index.html 中
想写的详细一点，另开一篇
# clone
git clone git@github.com:nanyang24/eleme-vue.git
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build