项目功能演示

项目开发准备

创建项目并运行

资源准备

项目源码目录设计

stylus使用

组件化编码

引入vue-router

FooterGuide组件

各导航路由组件(静态)

HeaderTop组件

使用swiper实现商品分类列表轮播

ShopList组件(静态)

Login组件(静态)

启动后台应用并测试接口

封装ajax请求函数

封装接口请求函数

使用git对项目进行版本控制

复习

配置代理实现跨域ajax请求

创建vuex的整体结构

使用vuex管理首页数据

异步显示当前地地址

异步显示食品分类轮播列表

使用watch和$nextTick解决轮播的bug

异步显示商家列表

使用svg显示加载中提示界面

Star组件

注册登陆功能演示说明

登陆界面效果1_切换登陆方式

登陆界面效果2_手机号检查

登陆界面效果3_倒计时效果

登陆界面效果4_切换密码的显示和隐藏

登陆界面效果5_前台表达验证

复习

动态一次性图形验证码

定义接口请求函数

登陆_发送短信验证码

登陆_完成登陆请求

登陆_保存用户信息到vuex

登陆后更新个人中心界面

登陆更新跳转路由

自动登陆

退出登陆

搭建商家整体界面

json的理解

设计json数据

使用mockjs模拟接口数据

ajax请求mockjs模拟的接口

ShopHeader组件

复习

异步显示goods数据

滑动效果分析

使用better-scroll实现回弹滑动

收集scrollY

收集tops

滑动右侧列表更新当前分类

解决惯性滑动不更新当前分类的bug

点击分类项滑动右侧列表

CartControl组件1

CartControl组件2

Food组件1

Food组件2

ShopCart组件1

ShopCart组件2

显示购物项列表

解决列表显示的3个bug

复习

购物车动画

购物车列表的滑动

清空购物车

ShopRatings组件1

ShopRatings组件2

ShopInfo组件1

ShopInfo组件2

ShopInfo组件3

Search组件

缓存路由组件对象

路由组件懒加载

图片懒加载vue-lazyload

使用moment实现日期过滤器

打包文件分析与优化