vue饿了么学习-第三篇(需求分析)
2017-09-05 17:19
232 查看
1.对饿了么app进行分析,版面分为以下部分:顶部头,横导航栏,左边商品导航栏,右侧商品展示。
顶部头通常不变,
横导航栏,在进行切换的时候,会有颜色变化,
左侧商品导航栏+右边商品展示,超出内容,可以上下滑动,上部滑动边界不能影响到横导航栏。
左侧商品导航栏显示状态分为选中/未选中,
右侧商品展示,点击加号的时候,会有一个小球抛出的动画效果展示,掉入购物车中。
操作购物车的商品,对应右侧商品展示的数量,也出现对应的变化。
2.商品详情展示,版面分为以下部分:顶部商品大图,评论部分。
评论部分超出长度,可以滑动,并不影响上面头部。
3.切换横导航栏,到商品评论页,该版面分为:顶部商家名,商家整体评分,买家评论区。
4.切换横导航栏,到商家详情页,该版面分为:顶部商家名,商家地址,联系方式等。
顶部头通常不变,
横导航栏,在进行切换的时候,会有颜色变化,
左侧商品导航栏+右边商品展示,超出内容,可以上下滑动,上部滑动边界不能影响到横导航栏。
左侧商品导航栏显示状态分为选中/未选中,
右侧商品展示,点击加号的时候,会有一个小球抛出的动画效果展示,掉入购物车中。
操作购物车的商品,对应右侧商品展示的数量,也出现对应的变化。
2.商品详情展示,版面分为以下部分:顶部商品大图,评论部分。
评论部分超出长度,可以滑动,并不影响上面头部。
3.切换横导航栏,到商品评论页,该版面分为:顶部商家名,商家整体评分,买家评论区。
4.切换横导航栏,到商家详情页,该版面分为:顶部商家名,商家地址,联系方式等。
相关文章推荐
- 学习笔记之vue高仿饿了么课程项目--布局篇
- vue饿了么学习-第十一篇(弹出层样式)
- 学习笔记之vue高仿饿了么课程项目--vue.js篇
- vue饿了么学习笔记(1)关于dev-server.js消失的问题
- vue饿了么学习-第七篇(组件拆分)
- vue饿了么学习-第十篇(header样式)
- vue2.0 饿了么项目学习总结
- vue饿了么学习-第二篇(webpack)
- vue饿了么学习-第八篇(vue-router)
- vue饿了么学习-问题1(style文件报错)
- vue饿了么学习-第十篇(配置路由)
- vue饿了么学习-第四篇(web字体)
- vue饿了么学习-第五篇(项目结构)
- vue饿了么学习-第九篇(Vue-resource)
- vue饿了么学习-第六篇(mock数据)
- vue的学习
- vue学习 - webpack (初步)手动配置方法
- Vue学习 第2天 又看了个教程,加深理解
- Vue.js 学习(二)
- Vue 学习笔记 — 无法避免的dom操作