Skip to content

TencentIT/vueEle

Repository files navigation

vue外卖项目

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

后端:数据是模拟的,存放在data.json中

运行

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开发的话 非常清晰的操作流程,不容易出错,保证了代码的可维护性 。

About

移动端h5点餐项目

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published