目录

  • 1 初识Vue.js
    • 1.1 Vue简介
    • 1.2 Vue开发环境
    • 1.3 Vue的初使用
  • 2 Vue.js 开发基础
    • 2.1 单文件组件
    • 2.2 数据绑定
    • 2.3 指令
    • 2.4 事件对象和事件修饰符
    • 2.5 计算属性和侦听器
    • 2.6 样式绑定
    • 2.7 案例:购物车模块
    • 2.8 案例:学习计划表
  • 3 组件基础(上)
    • 3.1 构建工具Vite
    • 3.2 选项式API和组合式API
    • 3.3 组合式编程
    • 3.4 生命周期
    • 3.5 组件的注册与引用
    • 3.6 组件通信
      • 3.6.1 父组件向子组件传递数据
      • 3.6.2 子组件向父组件传递数据
      • 3.6.3 跨级组件之间的数据传递
    • 3.7 案例:待办事项
  • 4 组件基础(下)
    • 4.1 动态组件
    • 4.2 插槽
    • 4.3 自定义指令
    • 4.4 引用静态资源
    • 4.5 案例:商品管理
  • 5 网络请求
    • 5.1 Axios
    • 5.2 Axios图书列表案例
  • 6 状态管理
    • 6.1 Vuex
    • 6.2 Pinia
  • 7 路由
    • 7.1 初识路由和VueRouter
    • 7.2 嵌套路由
    • 7.3 路由重定向
    • 7.4 动态路由
    • 7.5 命名路由
    • 7.6 编程式导航
    • 7.7 导航守卫
    • 7.8 案例:后台管理系统
  • 8 常用UI组件库
    • 8.1 Element Plus组件库
    • 8.2 Vant组件库
    • 8.3 Ant Design Vue组件库
  • 9 项目实战
    • 9.1 项目所需软件
    • 9.2 项目前台分析
    • 9.3 “微商城”后台分析
项目所需软件
  • 1 WampServer软件
  • 2 MySQL软件
  • 3 “微商城”的项目...

一、WampServer软件



wampserver安装步骤

      1、在华军软件园下载Wamp Server安装包,在电脑本地得到一个压缩包使用360压缩软件解压后,双击.exe文件进入Wamp Server安装导向界面,点击【next】。

WampServer截图

      2、进入Wamp Server安装许可协议界面,主要是wamp的一些使用作者和使用声明信息,可以不用看选择【I accept】然后点击【next】。

WampServer截图

      3、选择安装Wamp Server的安装位置,您可以直接点击【next】,软件会默认安装。或者您可以点击【Browse】弹出安装位置界面,您可以自己选择Wamp Server安装位置,选择完成后点击【next】。

WampServer截图

      4、进入Wamp Server安装选项界面,您可以自行选择是否勾选Create Desktop icon(创建创面快捷方)和Create a Quick Lanuch icon(创建启动栏快捷方式),选择完成后点击【next】。

WampServer截图

      5、准备安装Wamp Server,您可先检查一下安装位置是否正确,如果没有错误点击【install】就可以了。

WampServer截图

      6、Wamp Server正在安装中,您需要耐心等待安装完成就可以了。

WampServer截图

      7、需要您设置SMTP和输入您的邮件地址,输入完成后,点击【next】。

WampServer截图

      8、Wamp Server安装完成,您可以勾选“现在运行Wamp Server软件”点击【finish】会自动打开软件。

WampServer截图