vue外卖项目

前端：vue-cli+vue-router+ES6+stylus+eslint+webpack

后端：数据是模拟的，存放在data.json中

项目地址：http://39.105.101.78:8088

运行

git clone [email protected]:TencentIT/vueEle.git

cd vueEle

npm install

npm start

功能：

1.实现了基本的点餐功能，整个项目基于Vue.js实现。

2.用到了Vue的双向数据绑定，动画，以及父子组件传递数据，非父子组件之间数据、事件的传递。

3.CSS代码用预编译语言stylus书写，同时引用better-scroll模块实现页面接近于手机滚动的效果。

4.整个项目引入了eslint模块，规范了代码书写的规范。

5.用双向数据绑定，组件间通信以及计算属性实现了商品加入购物车，商品的数量增加/减少，商品价格相应改变的功能。

首页

小球飞入动画

详情页面

购物车

商家页面

弹层页面

项目总结：

通过这个项目对Vue的以操作数据为中心的思想理解的更透彻了，只要数据改变，对应的其他状态都发生相应的改变，

包括动画效果，按钮等状态的变化都是基于数据的变化，和非MVVM框架，例如jQuery，用jQuery 操作DOM来写的话，

工作量是非常大的，用vue开发的话 非常清晰的操作流程，不容易出错，保证了代码的可维护性 。