本书通过应用示例和综合案例对Vue.js 3.0的相关知识进行讲解与演练，旨在使读者快速掌握Vue.js的用法，并提高使用Vue开发网站、平台与App的实战能力。本书分为11章，内容包括Vue核心设计思想、开发环境的搭建、Vue实例的创建、数据绑定、事件监听操作、常用API、页面渲染方法、过渡与动画、Vue路由原理、动态路由的嵌套、Vuex状态管理、Vue脚手架、服务器端渲染，以及“微商城”项目实战等。 本书内容丰富，理论与实践相结合，提供配套示例源代码、教学课件和教学视频等资源，可作为高等院校相关专业的教材，也可作为Web前端开发初学者、移动网站与App设计开发人员的参考读物。

第1章统信UOS环境搭���1 1.1统信UOS概述2 1.1.1统信概述2 1.1.2功能列表3 1.1.3统信UOS应用商店6 1.2使用U盘安装统信UOS7 1.2.1UOS镜像的下载8 1.2.2安装前准备8 1.2.3正式安装（**全盘 安装）10 1.2.4启动及激活16 1.3初识Vue.js18 1.3.1前端技术的发展18 1.3.2什么是Vue.js19 1.4Vue开发环境安装和配置21 1.4.1Vue下载和引入21 1.4.2Node.js安装及环境 配置22 1.4.3npm包管理工具25 1.4.4Vue入门程序—— Hello Vue.js26 1.5使用WebStorm创建Vue 项目28 1.6解读Vue项目文件目录 结构31 1.7综合案例——实现简单逻辑 计算器32 本章小结34 经典面试题35 上机练习35 第2章Vue实例、数据绑定及指令36 2.1Vue实例37 2.1.1创建Vue实例37 2.1.2el参数37 2.1.3data数据对象38 2.1.4methods实例方法39 2.1.5computed属性41 2.1.6watch状态监听43 2.2Vue数据绑定45 2.2.1属性绑定46 2.2.2双向数据绑定47 2.3Vue指令48 2.3.1vmodel49 2.3.2vtext52 2.3.3vhtml53 2.3.4vbind54 2.3.5von55 2.3.6vif57 2.3.7vshow59 2.3.8vfor62 2.4综合案例——实现购物清单 功能65 本章小结66 经典面试题67 上机练习67 第3章Vue事件、组件及生命周期68 3.1Vue事件69 3.1.1事件监听69 3.1.2事件修饰符703.1.3按键修饰符71 3.2Vue组件72 3.2.1什么是组件72 3.2.2局部注册组件73 3.2.3组件之间的数据 传递75 3.2.4组件切换81 3.3Vue生命周期83 3.3.1钩子函数83 3.3.2实例创建84 3.3.3页面挂载85 3.3.4数据更新87 3.3.5实例销毁89 本章小结92 经典面试题92 上机练习92 第4章Vue全局API及实例属性93 4.1全局API94 4.1.1自定义全局指令94 4.1.2使用插件95 4.1.3组件构造器97 4.1.4设置值98 4.1.5全局注册混入100 4.2实例属性101 4.2.1vm.$el102 4.2.2vm.$data103 4.2.3vm.$options104 4.2.4vm.$root105 4.2.5vm.$children106 4.2.6vm.$slots108 4.3全局配置110 4.3.1silent110 4.3.2devtools111 4.3.3productionTip112 4.4组件进阶113 4.4.1mixins113 4.4.2render115 4.4.3createElement117 本章小结119 经典面试题119 上机练习119 第5章Vue过渡和动画120 5.1过渡与动画121 5.1.1了解过渡与动画121 5.1.2transition组件121 5.2单元素/组件的过渡124 5.2.1使用@keyframes 创建CSS动画124 5.2.2animate.css结合 transition实现动画 …126 5.2.3钩子函数实现 动画128 5.3多个元素的过渡130 5.3.1不同标签名元素的 过渡130 5.3.2相同标签名元素的 过渡132 5.4多个组件的过渡133 5.5列表过渡135 5.5.1什么是列表过渡135 5.5.2列表的进入和离开 过渡135 5.5.3列表的排序过渡138 本章小结140 经典面试题140 上机练习141 第6章Vue路由142 6.1初识路由143 6.1.1后端路由143 6.1.2前端路由143 6.2Vue Router144 6.2.1Vue Router的工作 原理144 6.2.2Vue Router的安装和 使用145 6.2.3路由对象的属性148 6.3动态路由148 6.3.1什么是动态路由148 6.3.2query方式传参149 6.3.3params方式传参151 6.4嵌套路由153 6.4.1什么是嵌套路由153 6.4.2嵌套路由案例154 6.5程序化导航157 6.5.1页面导航的两种 方式157 6.5.2router.push（）157 6.5.3router.go（）160 6.6命名路由161 6.6.1什么是命名路由161 6.6.2综合案例161 6.7命名视图163 6.7.1什么是命名视图163 6.7.2综合案例163 本章小结166 经典面试题166 上机练习166 第7章Vuex状态管理167 7.1初识Vuex168 7.1.1什么是Vuex168 7.1.2状态管理模式169 7.1.3Vuex的下载和 安装170 7.2核心概念172 7.2.1state172 7.2.2getters175 7.2.3mutations177 7.2.4actions178 7.2.5module180 7.3Vuex中的API185 7.3.1模块注册185 7.3.2状态替换186 7.4综合案例——实现购物车 功能187 7.4.1案例分析187 7.4.2代码实现188 本章小结196 经典面试题196 上机练习196 第8章Vue CLI（Vue脚手架）197 8.1初识Vue CLI198 8.1.1安装前的注意事项 … 198 8.1.2全局安装@vue/CLI … 198 8.1.3使用vue create命令 创建项目 198 8.1.4使用GUI创建 项目200 8.2插件204 8.2.1CLI插件204 8.2.2安装插件204 8.3CLI服务和配置文件205 8.3.1CLI服务205 8.3.2配置文件207 8.3.3配置多页应用209 8.4环境变量和模式212 8.4.1环境变量212 8.4.2模式213 8.5静态资源管理214 8.5.1相对路径引入静态 资源214 8.5.2public目录引入静态 资源215 8.6综合案例——使用Vue CLI 快速创建Vue项目215 8.6.1项目配置215 8.6.2安装插件218 本章小结220 经典面试题220 上机练习221 第9章服务器端渲染222 9.1初识服务器端渲染223 9.1.1客户端渲染与服务 器端渲染的区别223 9.1.2服务器端渲染的 注意事项224 9.2服务器端渲染的简单 实现224 9.2.1创建vuessr项目224 9.2.2渲染Vue实例225 9.2.3Express搭建SSR …225 9.2.4Koa搭建SSR227 9.3webpack搭建服务器端 渲染229 9.3.1基本流程229 9.3.2项目搭建229 9.4Nuxt.js服务器端渲染 框架234 9.4.1创建Nuxt.js项目 …234 9.4.2页面和路由236 9.4.3页面跳转237 9.5综合案例——通过Node.js Express实现Web服务器端 渲染238 本章小结241 经典面试题241 上机练习241 第10章信创静态资源服务器242 10.1Tengine服务器基础243 10.1.1Tengine概述243 10.1.2Tengine下载及 安装244 10.2静态资源服务器基本 概念245 10.2.1Tengine服务器的 基本架构及工作 特点245 10.2.2Tengine基础概念 …246 10.3Tengine服务器的部署251 10.3.1Tengine平台初 始化251 10.3.2Tengine主配置 文件说明254 本章小结256 经典面试题256 上机练习256 第11章综合项目——构建电商后台 管理系统257 11.1开发准备258 11.1.1项目展示258 11.1.2技术方案259 11.1.3项目开发流程260 11.2项目搭建260 11.2.1使用vite构建 Vue3项目260 11.2.2配置Element Plus 261 11.2.3配置路由262 11.2.4配置ElementPlus 图标264 11.2.5引入less265 11.2.6配置vuex265 11.2.7配置mock.js266 11.2.8二次封装axios …268 11.2.9目录结构272 11.3页面的布局结构273 11.3.1顶部标签栏273 11.3.2左侧菜单栏275 11.3.3tag标签276 11.3.4模块页面区279 11.3.5页面结构组合 效果280 11.4登录页面281 11.4.1动态路由的 实现281 11.4.2登录退出功能的 实现281 11.4.3路由守卫的 实现282 11.5首页283 11.5.1用户信息283 11.5.2数据展示284 11.5.3折线图（Echart 表格）286 11.5.4柱状图（Echart 表格）289 11.5.5饼状图（Echart 表格）291 11.6用户管理292 11.6.1获取用户数据292 11.6.2用户的分页 实现295 11.6.3用户数据的增删 改查296 本章小结303 经典面试题304