目    录

第1篇  Bootstrap

第1章  Bootstrap设计基本原理 3

任务1.1  视口 4

1.1.1  Bootstrap概述 4

1.1.2  响应式设计概念 5

1.1.3  视口 6

任务1.2  媒体查询 8

1.2.1  Bootstrap编辑器 9

1.2.2  媒体查询概述 10

任务1.3  栅格系统 11

1.3.1  栅格系统概述 12

1.3.2  容器 12

任务1.4  弹性盒布局 14

1.4.1  流式布局 14

1.4.2  弹性盒布局 15

本章小结 17

自测题 17

第2章  Bootstrap CSS技术 19

任务2.1  Bootstrap?排版 20

2.1.1  Bootstrap样式 21

2.1.2  标题 22

任务2.2  Bootstrap表格 24

2.2.1  表格概述 25

2.2.2  表格种类 26

任务2.3  Bootstrap?表单 28

2.3.1  表单 28

2.3.2  表单的类型 29

任务2.4  Bootstrap?按钮 30

2.4.1  按钮 30

2.4.2  按钮组 31

任务2.5  Bootstrap?图片 33

2.5.1  图片 34

2.5.2  图片类型 34

本章小结 35

自测题 35

第3章  Bootstrap布局组件 37

任务3.1  Bootstrap下拉菜单 38

3.1.1  下拉菜单 38

3.1.2  按钮下拉菜单 39

任务3.2  Bootstrap输入框组 40

3.2.1  输入框组 41

3.2.2  标签 41

任务3.3  Bootstrap导航栏 43

3.3.1  导航栏 43

3.3.2  导航栏属性 44

任务3.4  Bootstrap分页 46

3.4.1  分页 47

3.4.2  翻页 47

任务3.5  Bootstrap列表组 49

3.5.1  徽章 49

3.5.2  列表组 51

本章小结 52

自测题 52

第4章  Bootstrap插件 55

任务4.1  Bootstrap?模态框 56

4.1.1  创建模态框 56

4.1.2  模态框的事件 58

任务4.2  Bootstrap?弹出框 60

4.2.1  弹出框 60

4.2.2  警告框 61

任务4.3  Bootstrap?轮播 62

4.3.1  多媒体对象 63

4.3.2  轮播图 63

任务4.4  Bootstrap?折叠 64

4.4.1  折叠菜单 65

4.4.2  折叠选项 65

本章小结 67

自测题 67

第5章  影视娱乐项目实战 69

任务描述 70

任务分析 70

任务实现 70

本章小结 90

自测题 90

第2篇  Vue

第6章  Vue概述 95

任务6.1  初识Vue 96

6.1.1  Vue 96

6.1.2  Vue的特性 97

6.1.3  Vue的版本 98

任务6.2  第一个Vue程序 98

6.2.1  Vue的下载与引入 99

6.2.2  第一个Vue程序 100

6.2.3  Vue调试工具Vue Devtools 101

本章小结 104

自测题 104

第7章  Vue模板语法 106

任务7.1  Vue实例与生命周期 107

7.1.1  创建Vue实例 107

7.1.2  组件选项 108

7.1.3  生命周期钩子 110

任务7.2  插值和指令 113

7.2.1  插值 114

7.2.2  指令 117

本章小结 119

自测题 120

第8章  Vue指令 121

任务8.1  Vue样式绑定指令 122

8.1.1  绑定HTML class样式 122

8.1.2  绑定内联样式 128

任务8.2  Vue事件绑定指令 131

8.2.1  监听事件 132

8.2.2  事件处理方法 132

8.2.3  事件对象 134

8.2.4  事件修饰符 135

8.2.5  按键修饰符 139

8.2.6  系统修饰键 140

任务8.3  Vue双向绑定指令 142

8.3.1  表单双向绑定基础用法 143

8.3.2  值绑定 148

8.3.3  修饰符 149

任务8.4  Vue条件渲染指令 152

8.4.1  v-if/v-else/v-else-if指令 152

8.4.2  v-show指令 155

8.4.3  v-if指令和v-show指令的

区别 155

任务8.5  Vue列表渲染指令 157

8.5.1  使用v-for指令遍历数组 157

8.5.2  使用v-for指令遍历对象 159

8.5.3  使用v-for指令遍历整数 160

8.5.4  数组更新检测 160

8.5.5  key属性 161

8.5.6  在 <template> 中使用 v-for

指令 163

8.5.7  v-for指令与v-if指令一同

使用 164

本章小结 165

自测题 166

第9章  计算属性与侦听器 168

任务9.1  计算属性 169

9.1.1  计算属性的定义 169

9.1.2  计算属性的缓存 171

9.1.3  计算属性的getter方法

和setter方法 173

任务9.2  侦听器 176

9.2.1  侦听属性 176

9.2.2  侦听器的其他形式 178

9.2.3  实例方法$watch 181

本章小结 183

自测题 183

第10章  组件基础 186

任务10.1  组件的定义 187

任务10.2  组件的注册 189

10.2.1  全局注册 189

10.2.2  局部注册 191

任务10.3  通过prop向子组件传递

      数据 193

10.3.1  传递静态或动态的prop 194

10.3.2  单向数据流 196

10.3.3  prop的验证 197

10.3.4  非prop属性 198

任务10.4  监听子组件事件 200

10.4.1  使用事件抛出一个值 201

10.4.2  在组件上使用v-model

 指令 202

任务10.5  插槽 205

10.5.1  插槽内容 205

10.5.2  渲染作用域 206

10.5.3  默认内容 206

10.5.4  具名插槽 207

10.5.5  作用域插槽 208

任务10.6  动态组件 210

本章小结 214

自测题 214

第11章  Vue CLI 217

任务11.1  Vue CLI脚手架搭建 218

11.1.1  Vue CLI简介 218

11.1.2  Node.js环境搭建 219

11.1.3  安装脚手架 221

11.1.4  创建项目 222

11.1.5  项目结构 223

本章小结 226

自测题 226

第12章  Vue路由和状态管理 228

任务12.1  Vue Router 229

12.1.1  路由的基本使用 230

12.1.2  嵌套路由 234

12.1.3  命名路由 236

任务12.2  状态管理——Vuex 240

12.2.1  初识Vuex 240

12.2.2  Vuex的基本使用 242

本章小结 250

自测题 250

第13章  开放大学项目实战 253

任务描述 254

任务分析 256

任务实现 256

本章小结 269

自测题 269

第3篇  React

第14章  初识React 275

任务14.1  React概述及基本使用 276

14.1.1  React概述 276

14.1.2  React的特点 277

14.1.3  React的安装 278

14.1.4  React的使用 281

14.1.5  React脚手架的使用 282

任务14.2  JSX简介 286

14.2.1  JSX概述 286

14.2.2  JSX的语法 287

14.2.3  JSX中使用JavaScript

 表达式 289

14.2.4  JSX的条件渲染 292

14.2.5  JSX的列表渲染 294

14.2.6  JSX的样式处理 295

本章小结 298

自测题 298

第15章  React组件 300

任务15.1  React组件概述 301

15.1.1  组件的定义 301

15.1.2  组件的特点 303

15.1.3  React组件的两种创建

 方式 303

15.1.4  React事件处理 304

15.1.5  组件中的props 307

15.1.6  组件中的state 308

任务15.2  React组件的生命周期 312

15.2.1  组件生命周期 312

15.2.2  事件分类 313

15.2.3  组件生命周期的三个阶段 315

任务15.3  在React中使用表单 319

15.3.1  受控组件 320

15.3.2  定义表单元素 320

15.3.3  非受控组件 324

本章小结 327

自测题 327

第16章  虚拟社区网站项目实战 331

任务描述 332

任务分析 332

任务实现 333

本章小结 340

自测题 341

参考文献 343