党的二十大报告提出实施科教兴国战略，强化现代化建设人才支撑。深入实施人才强国战略，培养造就大批德才兼备的高素质人才，是国家和民族长远发展的大计。为贯彻落实党的二十大精神，筑牢政治思想之魂，编者在牢牢把握这个原则的基础上编写了本书。
信创作为国家的战略性发展方向，近两年得到了长足发展，尤其是在当前大环境下，信创产业已成为国家信息产业的重点方向之一，因此，在信创技术平台下进行项目开发也成了学习的重点。
Vue.js是当下火热的前端开发技术之一，广泛用于Web开发和单页面应用程序，很容易与其他项目和库集成，使用起来也非常简单。即使是初学者，也可以轻松理解Vue.js，并构建自己的用户界面。
本书涵盖基础知识和项目实战，专为初学者和专业人士设计。本书基于当前最新的Vue.js 3.0版本进行编写。本书分为11章，主要内容如下。
第1章介绍信创技术的发展情况，包括基于统信UOS开发环境的建立、Vue的基本概念，以及如何创建基于Vue CLI的项目。
第2章完整介绍Vue实例对象的创建方式、Vue模板语法、数据绑定以及常用内置指令的使用。
第3章详细介绍Vue的事件机制、Vue组件的创建和注册、父子组件数据传递，以及Vue的生命周期钩子函数。
第4章主要介绍Vue全局API的使用、Vue常用实例属性的使用，以及Vue全局配置。
第5章介绍Vue中使用过渡和动画对页面进行渲染。
第6章详细介绍Vue中路由的基本概念、路由对象的属性、VueRouter的基本使用。
第7章主要介绍Vuex的下载和安装、Vuex的5个核心对象，以及如何利用Vuex进行状态管理。
第8章主要讲解Vue CLI的安装和基本使用、CLI插件及其相关配置。
第9章讲解服务器端渲染的概念及使用、客户端渲染和服务器端渲染的区别。
第10章讲解与信创相关的前端静态资源服务器Tengine的安装及项目的部署方式。
第11章通过新闻Web App项目的开发对ElementUI、Vuex、VueRouter、axios等前端库和组件库及插件的使用方法进行综合演示。
第1～7章的内容相对容易，刚入门Vue.js的开发者也能很快掌握。
第8～11章首先介绍Vue CLI，然后充分利用Vue.js的基础知识完成实战项目的开发。
本书特色
●包含信创技术体系知识，有助于读者在新平台下学习开发。
●针对Vue的使用者，是前端开发的书籍。
●从介绍到使用再到实战，可以作为一本Vue使用手册。
●代码清晰、迭代完整，便于读者完整、全面地掌握和学习Vue。
●注重从实战经验方面进行讲解，非常实用。
阅读指南
本书基础内容和实战项目共存，适用于刚接触信创技术并对Vue.js的前端或后端有兴趣的开发者。当然，有一定Vue.js或信创技术开发经验的读者也能从中收获不少实战经验。
本书要求读者已经了解和掌握HTML和CSS的相关知识，并有一定的JavaScript语法基础，同时对Linux知识有一定程度的认知，否则阅读本书会有一定的难度。
使用本书要求
本书第1～7章中的示例只需要一台独立的计算机，用于信创环境的搭建，包括浏览器和编译器两个环境，浏览器以Chrome为例进行演示；第8～11章中的示例需要读者了解并安装Node.js和Vue CLI,开发工具可使用Visual Studio Code或者WebStorm。
其他
尽管我们希望在最大程度上做到尽善尽美，但错误依然在所难免。
读者如对本书有任何疑问，均可发送邮件至511167169@qq.com,我们将竭诚为您服务。
编者2023年7月
第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.1vmodel49
2.3.2vtext52
2.3.3vhtml53
2.3.4vbind54
2.3.5von55
2.3.6vif57
2.3.7vshow59
2.3.8vfor62
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创建vuessr项目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
精品教材 更多
