该项目实现了电商平台主线业务功能，电商首页、一级分类、二级分类、商品详情、购物车、结算、支付、个人中心、订单管理、订单详情。项目采用前后端分离模式，前台使用了V

*   第一章 Vue3.0小兔鲜儿电商项目/

  *   Vue3.0组合式API(01)/

    *   01-为什么学vue3

    *   02-vite基本使用

    *   03-创建vue应用

    *   04-选项API和组合API

    *   05-组合API-setup函数

    *   06-组合API-生命周期

  *   Vue3.0组合式API(02)/

    *   07-组合API-reactive函数

    *   08-组合API-toRef函数

    *   09-组合API-toRefs函数

    *   10-组合API-ref函数

    *   11-知识运用案例

  *   Vue3.0组合式API(03)/

    *   12-组合API-computed函数-01基本使用

    *   12-组合API-computed函数-02高级使用

    *   13-组合API-watch函数

    *   13-组合API-watch函数-需要深度监听情况

    *   14-组合API-ref属性

  *   Vue3.0组合式API(04)/

    *   15-组合API-父子通讯-01父传子

    *   15-组合API-父子通讯-02子传父

    *   15-组合API-父子通讯-03-v-model新用法

    *   16-组合API-依赖注入

  *   项目介绍/

    *   01-补充-v-model语法糖

    *   02-补充-mixins语法

    *   03-项目介绍

    *   04-配套资源

    *   05-使用技术

    *   06-前情提要

  *   项目搭建/

    *   07-创建项目

    *   08-目录调整-01调整代码和目录

    *   09-目录调整-额外配置文件

    *   10-vuex-vue3.0的根模块各种用法

    *   11-vuex-vue3.0模块的用法

    *   12-准备远端仓库查看代码

  *   Vuex持久化+axios拦截器/

    *   13-vuex-持久化

    *   14-请求工具-01创建新axios实例&请求拦截器

    *   15-请求工具-响应拦截器

  *   axios请求封装+路由设计/

    *   16-请求工具-03-请求函数封装

    *   17-请求工具-04-测试请求工具函数

    *   18-路由设计

    *   19-首页-路由与组件

    *   20-首页-less的自动化导入-01准备变量文件和混入文件

    *   21-首页-less的自动化导入-02自动导入

  *   首页布局分析+布局/

    *   01-昨日回顾&今日介绍

    *   02-首页-样式重置与公用

    *   03-首页-顶部通栏布局

    *   04-首页-顶部通栏布局-setup使用vuex数据需要计算属性

    *   05-首页-头部布局

    *   06-首页-底部布局

  *   首页头部导航组件和交互/

    *   07-首页-头部分类导航组件

    *   08-首页-头部分类导航渲染

    *   09-首页-头部分类导航交互

    *   10-首页-吸顶头部组件-传统实现

    *   11-首页-吸顶头部组件-组合API

  *   首页主体区域布局和功能实现/

    *   12-首页主体-左侧分类-结构渲染

    *   13-首页主体-左侧分类-弹层展示

    *   14-首页主体-左侧分类-处理品牌

    *   15-首页主体-左侧分类-骨架效果

  *   轮播图布局+逻辑封装/

    *   01-昨日回顾&今日介绍

    *   02-首页主体-轮播图-基础布局

    *   03-首页主体-轮播图-渲染结构

    *   04-首页主体-轮播图-逻辑封装

  *   首页主体-面板封装/

    *   05-首页主体-面板封装

    *   06-首页主体-新鲜好物

    *   07-首页主体-人气推荐

    *   08-首页主体-补充-vue动画

    *   09-首页主体-面板骨架效果

  *   组件数据懒加载/

    *   10-首页主体-组件数据懒加载

    *   11-首页主体-组件数据懒加载-补充

    *   12-首页主体-热门品牌-01基础功能

    *   13-首页主体-热门品牌-02骨架和数据懒加载

  *   图片懒加载/

    *   14-首页主体-商品区块

    *   15-首页主体-最新专题

    *   16-首页主体-图片懒加载-01-IntersectionObserver了解

    *   17-首页主体-图片懒加载-02-懒加载指令

  *   面包屑组件/

    *   00-昨日回顾&今日介绍

    *   01-顶级类目-面包屑组件-初级

    *   02-顶级类目-面包屑组件-高级-01过渡mp4

    *   02-顶级类目-面包屑组件-高级-02终极

  *   批量注册组件+分类商品/

    *   03-顶级类目-批量注册组件

    *   04-顶级类目-基础布局搭建

    *   04-顶级类目-基础布局搭建-改造

    *   05-顶级类目-分类商品-布局

    *   06-顶级类目-分类商品-展示

    *   07-顶级类目-面包屑切换动画

  *   筛选区展示/

    *   08-二级类目-处理跳转细节

    *   09-二级类目-展示面包屑

    *   10-二级类目-筛选区展示

  *   复选框组件封装+排序组件/

    *   00-昨日回顾&今日介绍

    *   01-二级类目-复选框组件封装

    *   02-二级类目-结果区-排序组件

  *   无限加载组件+排序和筛选/

    *   03-二级类目-结果区-数据加载-01-无限加载组件

    *   04-二级类目-结果区-数据加载-02-使用无限加载数据加载商品数据

    *   05-二级类目-结果区-进行筛选-01-排序

    *   06-二级类目-结果区-进行筛选-02-筛选

  *   图片预览组件+图片放大镜/

    *   07-商品详情-基础布局

    *   08-商品详情-渲染面包屑

    *   09-商品详情-图片预览组件

    *   10-商品详情-图片放大镜

    *   11-商品详情-基本信息展示

  *   城市组件/

    *   00-昨日回顾&今日介绍

    *   01-商品详情-城市组件-基础布局

    *   02-商品详情-城市组件-获取数据

    *   03-商品详情-城市组件-交互逻辑

  *   SKU&SPU概念/

    *   04-★规格组件-SKU&SPU概念

    *   05-★规格组件-基础结构和样式

    *   06-★规格组件-渲染与选中效果

  *   规格组件禁用效果/

    *   07-★规格组件-禁用效果-思路分析

    *   08-★规格组件-禁用效果-路径字典

    *   09-★规格组件-禁用效果-设置状态

  *   规格组件数据通讯/

    *   00-昨日反馈&今日介绍

    *   01-梳理下SKU组件选中和禁用功能

    *   02-★规格组件-数据通讯-01根据skuId默认选中按钮

    *   03-★规格组件-数据通讯-02选择sku后通知父组件sku信息

  *   商品详情中的相关组件（一）/

    *   04-商品详情-数量选择组件

    *   05-商品详情-按钮组件

    *   06-商品详情-同类推荐组件

  *   商品详情中的相关组件（二）/

    *   07-商品详情-标签页组件

    *   08-商品详情-热榜组件

    *   09-商品详情-详情组件

    *   10-商品详情-注意事项组件

  *   评价组件/

    *   11-商品详情-评价组件-头部渲染

    *   12-商品详情-评价组件-实现列表-01需求确认&基本布局

    *   12-商品详情-评价组件-实现列表-02-筛选参数准备&获取数据

    *   12-商品详情-评价组件-实现列表-03-完成渲染&格式化函数

  *   图片预览+分页组件/

    *   00-昨日反馈&今日介绍

    *   02-商品详情-评价组件-图片预览

    *   03-商品详情-评价组件-★分页组件-01依赖数据分析

    *   04-商品详情-评价组件-★分页组件-02得到需要的数据

    *   04-商品详情-评价组件-★分页组件-03渲染组件和切换分页

    *   04-商品详情-评价组件-★分页组件-04数据通讯和使用

  *   登录表单校验/

    *   05-登录-路由与组件

    *   06-登录-基础布局

    *   07-登录-切换效果

    *   08-登录-表单组件

    *   09-登录-表单校验-01-大致步骤

    *   09-登录-表单校验-02-基本使用

    *   09-登录-表单校验-03-完成所有校验

  *   消息提示组件封装/

    *   10-登录-消息提示组件封装-01基本功能和动画

    *   10-登录-消息提示组件封装-02函数式调用

  *   手机号登录/

    *   00-昨日反馈&今日介绍

    *   01-登录-账户登录

    *   02-登录-手机号登录-01-思路分析&发送短信验证码

    *   03-登录-手机号登录-02完成登录

  *   QQ登录流程分析+布局/

    *   04-退出登录

    *   05-登录-QQ登录-流程分析

    *   06-登录-QQ登录-按钮处理-01-本地host

    *   07-登录-QQ登录-按钮处理-02-按钮跳转

    *   08-登录-QQ登录-回跳页面-01-基础布局

    *   09-登录-QQ登录-回跳页面-02-绑定帐号组件&完善信息组件

  *   QQ登录表单校验/

    *   10-登录-QQ登录-已注册已绑定

    *   11-登录-QQ登录-已注册未绑定-01-获取唯一标识和昵称头像

    *   12-登录-QQ登录-已注册未绑定-02-表单校验

  *   QQ登录立即绑定+发送短信验证码/

    *   13-登录-QQ登录-已注册未绑定-03-发送短信验证码

    *   14-登录-QQ登录-已注册未绑定-04-立即绑定

    *   15-登录-QQ登录-未绑定没账号

  *   加入购物车分析+编写Vuex/

    *   00-每日反馈&今日介绍

    *   01-购物车功能分析

    *   02-加入购物车-本地（约定存储字段，编写vuex的mutations和actions,在商品详情加入购物车）

  *   头部购物车商品列表+删除操作/

    *   03-头部购物车-基础布局&渲染

    *   04-头部购物车-商品列表-本地

    *   05-头部购物车-删除操作-本地

  *   购物车页面列表展示+单选操作/

    *   06-购物车页面-基础布局

    *   07-购物车页面-列表展示-本地

    *   08-购物车页面-单选操作-本地

    *   09-购物车页面-全选操作-本地

  *   购物车页面删除操作+确认框组件/

    *   10-购物车页面-删除操作-本地

    *   11-购物车页面-确认框组件

  *   购物车批量删除+修改数量/

    *   00-每日反馈&今日介绍

    *   01-昨日回顾&今日介绍

    *   02-购物车页面-批量删除-本地

    *   03-购物车页面-无效商品-本地

    *   04-购物车页面-修改数量-本地

  *   购物车-修改规格/

    *   05-购物车页面-修改规格-本地-01组件准备和切换效果

    *   05-购物车页面-修改规格-本地-02-渲染规格

    *   05-购物车页面-修改规格-本地-03-修改规格

  *   登录合并购物车+加入购物车+修改规格/

    *   06-登录后-合并购物车

    *   07-登录后-商品列表

    *   08-登录后-加入购物车

    *   09-登录后-删除操作

    *   10-登录后-批量删除

    *   11-登录后-选中状态&修改数量

    *   12-登录后-修改规格 (1)

    *   13-登录后-修改规格 (2)

  *   下单结算页面渲染/

    *   14-下单结算

    *   15-结算-页面布局

    *   16-结算-渲染页面-01-获取数据&渲染结算页面

    *   17-结算-渲染页面-收货地址默认渲染

  *   对话框组件封装/

    *   00-昨日回顾&今日内容

    *   01-结算-对话框组件封装-01基本结构

    *   02-结算-对话框组件封装-02双向绑定

  *   收获地址切换和添加/

    *   03-结算-收货地址-切换-通知结算组件一个默认地址的ID

    *   04-结算-收货地址-切换-完成切换功能

    *   05-结算-收货地址-添加-准备对话框和表单

  *   提交订单/

    *   06-结算-收货地址-添加-添加收货地址完成

    *   07-结算-收货地址-修改

    *   08-结算-提交订单

  *   支付宝支付/

    *   09-支付-支付页面-基础布局

    *   10-支付-支付页面-信息展示-01获取数据展示金额

    *   10-支付-支付页面-信息展示-02倒计时函数封装

    *   11-支付-支付流程

    *   12-支付-等待支付和跳转支付宝

    *   13-支付-结果展示

  *   个人中心页面渲染/

    *   00-昨日反馈&今日内容

    *   01-个人中心-布局容器

    *   02-个人中心-基础布局

    *   03-个人中心-渲染页面

    *   04-个人中心-mock数据

    *   05-个人中心-模拟接口

  *   个人中心菜单激活/

    *   06-个人中心-菜单激活-01-routerlink的激活类名

    *   06-个人中心-菜单激活-02-嵌套路由写法改造

  *   订单管理tabs组件/

    *   07-订单管理-tabs组件-01-体验jsx语法

    *   07-订单管理-tabs组件-02-动态渲染结构

    *   07-订单管理-tabs组件-03-实现双向绑定和点击自定义事件

    *   07-订单管理-tabs组件-04使用组件渲染订单tab

  *   订单管理列表渲染/

    *   08-订单管理-基础布局

    *   09-订单管理-列表渲染-01-抽离组件和获取数据

    *   09-订单管理-列表渲染-02渲染订单组件

  *   订单管理（条件查询、取消、删除订单、确认收货、查看物流）/

    *   00-昨日回顾&今日内容

    *   01-订单管理-条件查询

    *   02-订单管理-取消订单

    *   03-订单管理-删除订单

    *   04-订单管理-确认收货

    *   05-订单管理-查看物流

  *   订单详情功能完善/

    *   06-订单详情-头部展示

    *   07-订单详情-steps组件

    *   08-订单详情-查看物流-01-async的setup组件使用

    *   09-订单详情-物流信息-02-teleport组件使用

    *   10-订单详情-商品信息

    *   11-订单详情-取消订单

    *   12-订单详情-确认收货

  *   项目总结和重点/

    *   13-再次购买

    *   14-总结-划重点

    *   15-总结-vue3.0踩过的坑

    *   16-Vue3.0关注功能