【图书推荐】《Vue.js 3.x+Element Plus从入门到精通(视频教学版)》

本书用处

内容简介

本书通过对Vue.js(简称Vue)的示例和综合案例的介绍与演练,使读者快速掌握Vue.js 3.x框架的用法,提高Web前端的实战开发能力。本书配套示例源码、PPT课件、教学大纲、教案、同步教学视频、习题及答案、其他资源、作者微信群答疑服务。

本书共分15章,内容包括Vue.js 3.x的基本概念、Vue.js模板应用、组件的方法和计算属性、表单的双向绑定、处理用户交互、精通组件和组合API、虚拟DOM和Render()函数、玩转动画效果、熟练使用构建工具Vue CLI和Vite、基于Vue 3的UI组件库Element Plus、网络通信框架axios、使用Vue Router进行路由管理、状态管理框架Vuex、基于Vue的网上商城系统实战,以及基于Element Plus的图书借阅系统实战。

适合读者

对Vue.js框架的初学者而言,是一本简明易懂的Vue入门书和工具书。

对从事Web前端开发的读者来说,也是一本难得的参考手册。

本书也适合作为高等院校或高职高专前端开发相关课程的教材。

作者简介

张工厂,郑州某软件公司技术副总,技术主攻方向为PHP、MySQL与Web前端技术,在Web应用开发、数据库管理方面具有丰富的实战经验。著有图书:《PHP 8从入门到精通(视频教学版)》《MySQL 5.7从入门到精通(视频教学版)(第2版)》《PHP 7+MySQL 8动态网站开发从入门到精通(视频教学版)》《HTML5+CSS3+jQuery Mobile+Bootstrap开发APP从入门到精通(视频教学版)》。

前言

Vue.js(简称Vue)是一套构建用户界面的渐进式框架,采用自底向上增量开发的设计。Vue.js的核心库只关注视图层,并且非常容易学习,与其他库或已有项目整合也非常方便,所以Vue.js能够在很大程度上降低Web前端开发的难度,因此深受广大Web前端开发人员的喜爱。

本书内容

本书共分15章,内容包括Vue.js 3.x的基本概念、Vue.js模板应用、组件的方法和计算属性、表单的双向绑定、处理用户交互、精通组件和组合API、虚拟DOM和Render()函数、玩转动画效果、熟练使用构建工具Vue CLI和Vite、基于Vue 3的UI组件库Element Plus、网络通信框架axios、使用Vue Router进行路由管理、状态管理框架Vuex。最后讲解基于Vue的网上商城系统开发和基于Element Plus的图书借阅系统开发,帮助读者进一步巩固和积累Vue.js项目的开发  经验。 

本书特色

系统全面:讲解由浅入深,涵盖所有Vue.js 3.x的知识点,便于读者循序渐进地掌握Vue前端开发技术。

注重操作:注重操作,图文并茂,在介绍示例的过程中,每个操作均有对应的插图。这种图文结合的方式,使读者在学习过程中能够直观、清晰地看到操作的过程以及效果,便于快速理解和掌握。

案例丰富:把知识点融汇于系统的示例中,并且结合综合案例进行拓展,让读者达到“知其然,并知其所以然”的效果。

疑难提示:本书对读者在学习过程中可能会遇到的疑难问题,以“提示”的形式进行说明,避免读者在学习的过程中走弯路。

作者答疑:本书作者提供微信群答疑服务,读者在阅读过程中有疑问和问题,均可通过微信群或微信直接联系作者,并可在微信群中相互交流。

丰富的配套资源下载

本书配套资源包括示例源码、PPT课件、同步教学视频、教学大纲、教案、习题与答案、Vue.js 3.x常见错误及解决方法、就业面试题及解答、Vue.js 3.x开发经验及技巧汇总、作者微信群答疑服务等,读者需要用微信扫描下面的二维码获取。

本书适合的读者

  • Vue前端开发初学者
  • Vue前端开发人员
  • Element Plus前端开发人员
  • Web应用开发人员
  • 高等院校或高职高专Web前端开发课程的学生

鸣谢

本书作者除了封面署名的张工厂,还有刘增杰和王英英,在此对他们作出的贡献表示感谢。同时,还要感谢清华大学出版社所有老师对本书出版所付出的努力。

作   者

2024年1月

目录

目    录
第 1 章  流行的前端开发框架Vue.js 1
1.1  前端开发技术的发展 1
1.2  熟悉MV*模式 2
1.2.1  MVC模式 2
1.2.2  MVVM模式 2
1.3  Vue.js概述 3
1.3.1  Vue.js“组件化”思想 3
1.3.2  Vue.js的发展历程 4
1.3.3  Vue.js 3.4的特性 5
1.4  安装Vue.js 3.x 6
1.4.1  使用CDN方式 6
1.4.2  NPM 6
1.4.3  命令行工具 7
1.4.4  使用Vite方式 7
1.5  案例实战——使用Vue.js框架 8
1.6  Vue.js 3.x的新变化 9
第 2 章  Vue.js模板应用 12
2.1  模板插值 12
2.1.1  文本插值 12
2.1.2  原始HTML 13
2.1.3  使用JavaScript表达式 14
2.2  常用的内置模板指令 15
2.2.1  v-on 16
2.2.2  v-text 17
2.2.3  v-once 18
2.2.4  v-pre 18
2.2.5  v-cloak 19
2.3  条件渲染 20
2.3.1  v-if/v-else-if/v-else 20
2.3.2  使用v-show指令进行条件渲染 22
2.4  使用v-for指令进行循环渲染 23
2.5  案例实战1——通过插值语法实现姓名组合 35
2.6  案例实战2——通过指令实现下拉菜单效果 36
第 3 章  组件的方法和计算属性 39
3.1  方法选项 39
3.1.1  使用方法 39
3.1.2  传递参数 41
3.1.3  方法之间的调用 42
3.2  使用计算属性 43
3.3  计算属性的get和set方法 44
3.4  计算属性的缓存 46
3.5  使用计算属性代替v-for和v-if 49
3.6  绑定HTML样式(class) 51
3.6.1  数组语法 51
3.6.2  对象语法 53
3.6.3  在组件上使用class属性 56
3.7  绑定内联样式(style) 57
3.7.1  对象语法 57
3.7.2  数组语法 59
3.8  案例实战1——设计隔行变色的商品表 60
3.9  案例实战2——使用计算属性设计购物车效果 63
第 4 章  表单的双向绑定 66
4.1  实现双向数据绑定 66
4.2  单行文本输入框 66
4.3  多行文本输入框 67
4.4  复选框 68
4.5  单选按钮 70
4.6  选择框 71
4.7  值绑定 74
4.7.1  复选框 74
4.7.2  单选框 75
4.7.3  选择框的选项 75
4.8  修饰符 76
4.8.1  lazy 76
4.8.2  number 77
4.8.3  trim 78
4.9  案例实战——设计用户注册页面 79
第 5 章  处理用户交互 81
5.1  监听事件 81
5.2  事件处理方法 82
5.3  事件修饰符 86
5.3.1  stop 86
5.3.2  capture 88
5.3.3  self 90
5.3.4  once 92
5.3.5  prevent 93
5.3.6  passive 94
5.4  按键修饰符 94
5.5  系统修饰键 96
5.6  使用监听器 97
5.7  监听方法 99
5.8  监听对象 100
5.9  案例实战1——使用监听器设计购物车效果 103
5.10  案例实战2——处理用户注册信息 105
第 6 章  精通组件和组合API 107
6.1  组件是什么 107
6.2  组件的注册 107
6.2.1  全局注册 108
6.2.2  局部注册 109
6.3  使用prop向子组件传递数据 110
6.3.1  prop的基本用法 110
6.3.2  单向数据流 113
6.3.3  prop验证 114
6.3.4  非prop的属性 116
6.4  子组件向父组件传递数据 117
6.4.1  监听子组件事件 118
6.4.2  将原生事件绑定到组件 119
6.4.3  .sync修饰符 121
6.5  插槽 123
6.5.1  插槽的基本用法 123
6.5.2  编译作用域 123
6.5.3  默认内容 124
6.5.4  命名插槽 125
6.5.5  作用域插槽 128
6.5.6  解构插槽prop 130
6.6  Vue.js 3.x的新变化1——组合API 131
6.7  setup()函数 131
6.8  响应式API 133
6.8.1  reactive()方法和watchEffect()方法 133
6.8.2  ref()方法 134
6.8.3  readonly()方法 135
6.8.4  computed()方法 135
6.8.5  watch()方法 136
6.9  Vue.js 3.x的新变化2——访问组件的方式 137
6.10  案例实战——使用组件创建树状项目分类 138
第 7 章  虚拟DOM和render()函数 140
7.1  虚拟DOM 140
7.2  render()函数 141
7.3  创建组件的VNode 144
7.4  使用JavaScript代替模板功能 145
7.4.1  v-if和v-for 145
7.4.2  v-on 146
7.4.3  事件和按键修饰符 146
7.4.4  插槽 147
7.5  函数式组件 149
7.6  JSX 149
7.7  案例实战——设计商品采购信息列表 150
第 8 章  玩转动画效果 153
8.1  单元素/组件的过渡 153
8.1.1  CSS过渡 153
8.1.2  过渡的类名 155
8.1.3  CSS动画 158
8.1.4  自定义过渡的类名 159
8.1.5  动画的JavaScript钩子函数 160
8.2  初始渲染的过渡 164
8.3  多个元素的过渡 165
8.4  列表过渡 166
8.4.1  列表的进入/离开过渡 167
8.4.2  列表的排序过渡 168
8.4.3  列表的交错过渡 169
8.5  案例实战1——商品编号增加器 171
8.6  案例实战2——设计下拉菜单的过渡动画 173
第 9 章  熟练使用构建工具Vue CLI和Vite 175
9.1  脚手架的组件 175
9.2  脚手架环境搭建 176
9.3  安装脚手架 179
9.4  创建项目 180
9.4.1  使用命令 180
9.4.2  使用图形化界面 182
9.5  分析项目结构 186
9.6  配置Sass、Less和Stylus 188
9.7  配置文件package.json 190
9.8  Vue.js 3.x新增开发构建工具——Vite 191
第 10 章  基于Vue 3的UI组件库Element Plus 194
10.1  Element Plus的安装与使用 194
10.2  基本组件 196
10.2.1  按钮组件 196
10.2.2  文字链接组件 198
10.2.3  间距组件 198
10.3  页面布局 201
10.3.1  创建页面基础布局 201
10.3.2  布局容器 203
10.4  表单类组件 205
10.4.1  单选框 205
10.4.2  复选框 206
10.4.3  标准输入框组件 208
10.4.4  带推荐列表的输入框组件 210
10.4.5  数字输入框 212
10.4.6  选择列表 213
10.4.7  多级列表组件 216
10.5  开关与滑块组件 218
10.5.1  开关组件 218
10.5.2  滑块组件 219
10.6  选择器组件 221
10.6.1  时间选择器 221
10.6.2  日期选择器 223
10.6.3  颜色选择器 224
10.7  提示类组件 225
10.7.1  警告组件 225
10.7.2  通知组件 227
10.7.3  消息提示组件 228
10.8  数据承载相关组件 229
10.8.1  表格组件 229
10.8.2  导航菜单组件 232
10.8.3  标签页组件 234
10.8.4  标记组件 236
10.8.5  结果组件 237
10.8.6  抽屉组件 238
10.9  案例实战——设计一个商城活动页面 240
第 11 章  网络通信框架axios 244
11.1  什么是axios 244
11.2  安装axios 244
11.3  基本用法 245
11.3.1  axios的get请求和post请求 245
11.3.2  请求同域下的JSON数据 247
11.3.3  跨域请求数据 249
11.3.4  并发请求 250
11.4  axios API 251
11.5  请求配置 251
11.6  创建实例 254
11.7  配置默认选项 254
11.8  拦截器 255
11.9  Vue.js 3.x的新变化——替代Vue.prototype 255
11.10  案例实战——显示近7日的天气情况 256
第 12 章  使用Vue Router进行路由管理 259
12.1  使用Vue Router 259
12.1.1  在HTML页面使用路由 259
12.1.2  在项目中使用路由 264
12.2  命名路由 266
12.3  命名视图 268
12.4  路由传参 272
12.5  编程式导航 277
12.6  组件与Vue Router间解耦 281
12.6.1  布尔模式 281
12.6.2  对象模式 284
12.6.3  函数模式 287
12.7  案例实战——开发网站会员登录页面 290
第 13 章  状态管理框架Vuex 295
13.1  什么是Vuex 295
13.2  安装Vuex 296
13.3  在项目中使用Vuex 297
13.3.1  搭建一个项目 297
13.3.2  state对象 299
13.3.3  getter对象 300
13.3.4  mutation对象 302
13.3.5  action对象 304
13.4  案例实战——设计一个商城购物车页面 306
第 14 章  基于Vue的网上商城系统开发 313
14.1  系统功能模块 313
14.2  使用Vite搭建项目 313
14.3  设计首页 314
14.3.1  页面头部组件 314
14.3.2  网页首页组件 315
14.3.3  网页页脚组件 320
14.4  设计商品详情页面 320
14.5  设计商品分类页面 322
14.6  设计商品结算页面 325
14.7  设计个人信息页面 328
14.8  设计订单信息页面 331
14.9  路由配置 334
14.10  系统的运行 335
第 15 章  基于Element Plus的图书借阅系统开发 336
15.1  使用Vite搭建项目 336
15.2  设计登录页面 338
15.3  设计注册页面 340
15.4  设计首页 341
15.5  设计会员信息页面 344
15.6  设计图书借阅信息页面 349
15.7  设计还书信息页面 351
15.8  系统的运行 353
15.9  系统的调试 353

正版购买

《Vue.js 3.x+Element Plus从入门到精通(视频教学版)(Web前端技术丛书)》(张工厂)【摘要 书评 试读】- 京东图书 (jd.com)

4.56=折非常合适。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/15140.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

HTML+CSS 响应式导航栏

效果演示 Code <div class="navbar"><input type="checkbox"><span></span><span></span><ul><li><a href="#">点赞</a></li><li><a href="#">关注&…

SpringCloud+Python 混合微服务,如何打造AI分布式业务应用的技术底层?

尼恩&#xff1a;LLM大模型学习圣经PDF的起源 在40岁老架构师 尼恩的读者交流群(50)中&#xff0c;经常性的指导小伙伴们改造简历。 经过尼恩的改造之后&#xff0c;很多小伙伴拿到了一线互联网企业如得物、阿里、滴滴、极兔、有赞、希音、百度、网易、美团的面试机会&#x…

【数据结构】数据结构中的隐藏玩法——栈与队列

前言&#xff1a; 哈喽大家好&#xff0c;我是野生的编程萌新&#xff0c;首先感谢大家的观看。数据结构的学习者大多有这样的想法&#xff1a;数据结构很重要&#xff0c;一定要学好&#xff0c;但数据结构比较抽象&#xff0c;有些算法理解起来很困难&#xff0c;学的很累。我…

前端基于word模板导出word文档

项目环境 vue2 js vue-cli等 依赖包都可以在npm官网找到对应文档 npm官网(英文) 1、依赖 安装依赖 docxtemplater npm i docxtemplaterfile-saver npm i file-saverjszip-utils npm i jszip-utilsjszip npm i jszip在对应页面或模块中引入依赖 import Docxtemplater …

QQ个性网空间日志网站模板源码

QQ个性网空间日志网站模板源码自带后台登录设置&#xff0c;适用于博客、文章、资讯、其他类网站内容使用。模板自带eyoucms内核&#xff0c;原创设计、手工书写DIVCSS&#xff0c;完美兼容IE7、Firefox、Chrome、360浏览器等;主流浏览器;结构容易优化;多终端均可正常预览。由于…

力扣刷题---2206. 将数组划分成相等数对【简单】

题目描述&#x1f357; 给你一个整数数组 nums &#xff0c;它包含 2 * n 个整数。 你需要将 nums 划分成 n 个数对&#xff0c;满足&#xff1a; 每个元素 只属于一个 数对。 同一数对中的元素 相等 。 如果可以将 nums 划分成 n 个数对&#xff0c;请你返回 true &#xf…

力扣刷题---3146. 两个字符串的排列差

题目描述 给你两个字符串 s 和 t&#xff0c;每个字符串中的字符都不重复&#xff0c;且 t 是 s 的一个排列。 排列差 定义为 s 和 t 中每个字符在两个字符串中位置的绝对差值之和。 返回 s 和 t 之间的 排列差 。 示例 1&#xff1a; 输入&#xff1a;s “abc”, t “b…

运用HTML、CSS设计Web网页——“西式甜品网”图例及代码

目录 一、效果展示图 二、设计分析 1.整体效果分析 2.头部header模块效果分析 3.导航及banner模块效果分析 4.分类classify模块效果分析 5.产品展示show模块效果分析 6.版权banquan模块效果分析 三、HTML、CSS代码分模块展示 1. 头部header模块代码 2.导航及bann…

【SpringCloud】Spring Cloud基本介绍

目录 回顾架构分类单体架构分布式架构微服务架构什么是微服务优点缺点微服务的架构特征&#xff1a;微服务架构面临的挑战技术挑战微服架构的设计原则微服务概念提供者(Provider)消费者(Consumer)RPC和Restful集群分布式 总结 服务拆分和远程调用服务拆分原则服务拆分示例 思考…

http项目改为/支持https的方案、无需修改后台代码

背景描述&#xff1a;原来的项目前后台都是http&#xff0c;现在某个服务要求前台必须使用https&#xff1b; 方案1&#xff1a;前台部署在https里&#xff0c;后面代码修改&#xff1b;但是微服务架构&#xff0c;后台工作量太大&#xff1b; 方案2&#xff1a;前台部署在ht…

Pytorch-08 实战:手写数字识别

手写数字识别项目在机器学习中经常被用作入门练习&#xff0c;因为它相对简单&#xff0c;但又涵盖了许多基本的概念。这个项目可以视为机器学习中的 “Hello World”&#xff0c;因为它涉及到数据收集、特征提取、模型选择、训练和评估等机器学习中的基本步骤&#xff0c;所以…

vue 打印、自定义打印、页面打印、隐藏页眉页脚

花了一天时间搞了个打印功能&#xff0c;现则将整体实现过程进行整理分享。先来看看效果图&#xff1a; 1、页面展示为&#xff1a; 2、重组页面打印格式为&#xff1a;这里重组页面的原因是客户要求为一行两列打印 &#xff01;内容过于多的行则独占一行显示完整。 整体实现&…

区块链论文总结速读--CCF A会议 USENIX Security 2024 共7篇 附pdf下载

Conference&#xff1a;33rd USENIX Security Symposium CCF level&#xff1a;CCF A Categories&#xff1a;网络与信息安全 Year&#xff1a;2024 Num&#xff1a;7 1 Title: Practical Security Analysis of Zero-Knowledge Proof Circuits 零知识证明电路的实用安全…

hbase版本从1.2升级到2.1 spark读取hive数据写入hbase 批量写入类不存在问题

在hbase1.2版本中&#xff0c;pom.xml中引入hbase-server1.2…0和hbase-client1.2.0就已经可以有如下图的类。但是在hbase2.1.0版本中增加这两个不行。hbase-server2.1.0中没有mapred包&#xff0c;同时mapreduce下就2个类。版本已经不支持。 <dependency><groupId>…

安全访问python字典:避免空键错误的艺术

新书上架~&#x1f447;全国包邮奥~ python实用小工具开发教程http://pythontoolsteach.com/3 欢迎关注我&#x1f446;&#xff0c;收藏下次不迷路┗|&#xff40;O′|┛ 嗷~~ 目录 一、引言 二、直接访问字典键的问题 三、使用get方法安全访问字典键 四、get方法的实际应…

Could not create connection to database server的错误原因

1、使用MyBatis 连接数据库报错 org.apache.ibatis.exceptions.PersistenceException: ### Error updating database. Cause: com.mysql.jdbc.exceptions.jdbc4.MySQLNonTransientConnectionException: Could not create connection to database server. ### The error may …

用队列实现栈,用栈实现队列

有两个地方会讨论到栈&#xff0c;一个是程序运行的栈空间&#xff0c;一个是数据结构中的栈&#xff0c;本文中讨论的是后者。 栈是一个先入后出&#xff0c;后入先出的数据结构&#xff0c;只能操作栈顶。栈有两个操作&#xff0c;push 和 pop&#xff0c;push 是向将数据压…

电脑如何远程监控?如何远程监控电脑屏幕?

远程监控是指通过网络技术和远程视频传输技术&#xff0c;实现对某一特定区域、设备或场景进行远程实时监测、管理、控制的一种技术手段。 它将视频传输、图像采集、数据存储和远程操作等多种技术相结合&#xff0c;能够在任意时间、任意地点实现对被监测对象的远程监控。 远程…

IO模型:同步阻塞、同步非阻塞、同步多路复用、异步非阻塞

目录 stream和channel对比 同步、异步、阻塞、非阻塞 线程读取数据的过程 同步阻塞IO 同步非阻塞IO 同步IO多路复用 异步IO 优缺点对比 stream和channel对比 stream不会自动缓冲数据&#xff0c;channel会利用系统提供的发送缓冲区、接收缓冲区。stream仅支持阻塞API&am…

轻松拿捏C语言——【字符函数】字符分类函数、字符转换函数

&#x1f970;欢迎关注 轻松拿捏C语言系列&#xff0c;来和 小哇 一起进步&#xff01;✊ &#x1f308;感谢大家的阅读、点赞、收藏和关注&#x1f495; &#x1f339;如有问题&#xff0c;欢迎指正 感谢 目录&#x1f451; 一、字符分类函数&#x1f319; 二、字符转换函数…