篇 系统介绍篇) ~' Z# N J+ ^8 }
第1章 权限管理系统介绍 3
$ a# [+ D& i5 p& y3 { C1.1 系统简介 3
9 C$ t* u/ p% H$ N8 ~1.2 系统架构 4
! S, v8 i9 c) n* Q' ]1.2.1 前端架构 4
: @4 |7 f& c/ U0 K1.2.2 后端架构 4
. T- j1 D$ l9 ~; R1.3 系统界面 5
7 P( m9 j# F& I) d1.3.1 登录页面 5
- l; v: Q' T: X" L+ f/ e1.3.2 系统主页 56 `5 C0 M1 `; b. q) E& h* ~
1.3.3 用户管理 6
( Z B% d9 }& D1.3.4 机构管理 6
- I, m7 j9 A4 L! _# a: _/ P- x1.3.5 角色管理 72 ]) q+ \- L% z
1.3.6 菜单管理 7
: z% ~' E% a `0 B! E+ F6 x, l" y1.3.7 字典管理 8
) C, x. g$ N8 i2 M1.3.8 系统配置 8
8 o3 A$ L) p6 O4 q$ i1.3.9 登录日志 83 N) ]. N) w( Y
1.3.10 操作日志 9* r9 p. d0 G4 q7 K' G: G
1.3.11 注册中心 9
! `+ X6 m$ P) D/ o1.3.12 接口文档 9
" L7 n1 f9 O- ]: V1 n* w6 W* I0 E1.3.13 数据监控 10
, t- v" G( F# `$ r# ^, V1.3.14 服务监控 11: \+ M! s8 i* i
1.3.15 备份还原 11
6 y/ H! q6 L7 R) y1.3.16 主题切换 11( I& y( {1 P/ f- U5 b0 p
第2章 安装指南 13
+ K! q" R8 y4 W1 }# q2.1 前端安装指南 135 C- |, |! O+ Y; y
2.1.1 开发环境 13# C' m6 p" ~1 `! R$ j5 n0 j( V
2.1.2 技术选型 13
2 F: N/ m1 V1 o, J2.1.3 项目结构 13
7 Y' C+ Z' M: l3 x$ ^0 x+ b& Z2.1.4 编译运行 14+ C$ m2 _. Z8 ~- n* T k( Y8 {
2.2 后端安装指南 14/ ]- X9 j$ H8 N2 @* R$ v" w% |0 I
2.2.1 开发环境 141 B! N+ {5 w" n+ g
2.2.2 技术选型 15% [4 q. b' ^) a9 m( q( a
2.2.3 项目结构 15
4 m6 t2 A5 [4 J0 `: O( v2.2.4 编译运行 15
5 ~: X2 |7 X6 u+ L第3章 关键技术 17$ O! G: Z6 Y% |) U$ w( X
3.1 Spring Boot 17
6 Z) k( f6 S: T0 S' V# p, G3.2 Spring Cloud 172 C9 B4 g# r$ W
3.2.1 Spring Cloud简介 173 t; K9 }! v" y$ e6 p5 P- m, q1 s) J
3.2.2 Spring Cloud架构 17! U: `8 X, j/ {# f _6 {
3.2.3 Spring Cloud组件 18
5 I7 M+ |9 T6 `) [% ]3.2.4 参考教程 19
; k6 x2 ~9 |* \! g' k* m7 \7 i3.3 Spring Security 192 w) ^7 \" ^7 r2 }9 Y' b, ?- ]3 ~; `
3.4 MyBatis 19
2 o7 M' [% }; H! x$ x3.5 Vue.js 19
" d0 C3 H5 p1 e1 o n3.6 Element 201 O) K- c+ \4 d z' _4 m. S
第二篇 后端实现篇9 S8 \& i4 m& _/ j1 z% Q4 g3 Q
第4章 数据库设计 23
* X7 b+ r0 U$ e- h! n4.1 数据库表设计 23
6 x8 h3 L: k8 P4.2 数据库表关系 235 [6 y3 O: V3 b$ p
4.3 数据库表结构 24
: e% Y& v: E" v6 Q3 q4.3.1 用户表(sys_user) 247 x3 [3 w/ `3 z- ]/ ^
4.3.2 角色表(sys_role) 25
! v7 E9 |+ J/ N" [' u$ x4.3.3 机构表(sys_dept) 25% I+ ]" h! v! y) ?9 G: b! p+ m" u& z
4.3.4 菜单表(sys_menu) 26" ], c" H! x6 i! Q
4.3.5 用户角色表(sys_user_role) 26
" S% [% B! D3 r* ~4.3.6 角色菜单表(sys_role_menu) 265 \% b7 @1 F/ |0 w2 @
4.3.7 角色机构表(sys_role_dept) 27" H B' B( r$ z. z& n) _# C
4.3.8 字典表(sys_dict) 27
- _1 |3 |% u* i( ^) z' i4.3.9 配置表(sys_config) 28; J2 N7 [) w& K$ N1 T1 k! T3 @4 k
4.3.10 操作日志表(sys_log) 28
4 S( w# P, `2 m# q$ r* Q9 u- g7 T9 S4.3.11 登录日志表(sys_login_log) 28
% J- f+ |# d1 e! p ~第5章 搭建开发环境 30
, X! t W. z2 Z! S5.1 开发环境准备 30$ S' ~$ k7 X& ~
5.1.1 安装JDK环境 30
s6 E9 t C v; w* ^/ G& Q5.1.2 安装Eclipse开发工具 30
6 ?2 d: r( C2 q/ i+ u5.1.3 安装MySQL数据库 30
* k# }* O9 n3 P1 E3 A5.1.4 安装Maven构建工具 31
) }, p5 h4 g# r( u: @7 G5.2 生成项目模板 31
( `+ M4 N. ~; n9 E/ ~5.3 导入Maven项目 31
1 d2 _9 M/ j. q8 P/ F# W5 ~5.4 编译打包运行 34
# y; V3 d) v }9 I y! E% E! u5.4.1 编译打包 345 A1 d3 p/ |/ [, c9 g4 F
5.4.2 启动应用 357 M( }9 l8 G8 Q# Y
5.4.3 修改启动端口 35
# T W. {! _; p5 F- H5.4.4 自定义Banner 355 h0 }' G8 k- V+ E; |/ n2 q6 G
5.4.5 接口测试 37 D3 @* y: ~$ c; Q2 F
第6章 集成Swagger文档 38
6 S1 |2 o, H* I, k6 [) Z* M2 {6.1 添加依赖 38
Q: k# O, ]" p% g* }, y6.2 配置类 39
, a0 T5 [ w* W W; L: a6.3 页面测试 39& p! H* @; T. a& J' ^: x
第7章 集成MyBatis框架 41# }3 _8 y9 G# K9 d/ o
7.1 添加依赖 41
0 A4 d& U" x1 }) u. J2 E9 D( T# o, |' ~7 l7.2 添加配置 42! c8 O: Q' Y I( X! ]
7.2.1 添加MyBatis配置 42
/ z* i1 W# D8 D) d g+ |* ^7.2.2 添加数据源配置 42
! r0 n" `+ R* |7.2.3 修改启动类 43
% B+ y' {0 V8 ^0 i- M J* e7.3 生成MyBatis模块 43
2 l2 E5 D5 o; j9 d# h7.4 编写服务接口 442 d" i: R/ K3 F+ D% W: o
7.5 配置打包资源 46
/ |( }( F1 M- r6 B1 c' {6 j2 m/ n7.6 编译运行测试 47
8 C+ E1 N# \- f第8章 集成Druid数据源 481 q% G4 y( D( `) X% E' |) V
8.1 Druid介绍 48
8 r9 L5 c7 H- U& @( s8.2 添加依赖 49
* U7 T+ C+ N& B+ `5 d( ^* y8.3 添加配置 495 k9 v' u) w% F4 `- A% G
8.4 配置Servlet和Filter 51: C( c) B- P7 ^) O& c+ ?3 u( I
8.5 编译运行 53
3 ?# L: }# m' \( l8.6 查看监控 54
, ]5 D% v4 N& r8 [$ z0 z/ Z8.6.1 登录界面 54
* x7 k7 B" S, K! A) H- |7 l8.6.2 监控首页 55
( a4 `& e0 k Y8.6.3 数据源 55
& I" Q6 i" k I5 C2 ]8.6.4 SQL监控 554 J9 [3 @7 Q) S0 R% ~
第9章 跨域解决方案 57! _7 M7 Y8 t7 t( f
9.1 什么是跨域 57. e- @: q- i" G; S0 ~( w
9.2 CORS 技术 57" t, q, P- j; O \' P" P! t$ W" y
9.2.1 简单请求 57* i* |* K, e% f0 i7 B8 a) @$ b
9.2.2 非简单请求 58
- ~) e4 B4 R* J. X9.3 CORS实现 594 l" p2 L- n: k/ `4 @ Q; \
第10章 业务功能实现 60! b* i( G- A i) u0 |" V
10.1 工程结构规划 60
7 b4 g! U% k( e; ] R( b: f/ [10.1.1 mango-admin 60
$ M: t7 y7 |( U# Q10.1.2 mango-common 62
: `/ ]; L4 z: I4 t( a0 N4 C10.1.3 mango-core 63: X4 ?( s* ]. e; s& S
10.1.4 mango-pom 636 \# c7 }0 ^- m( I# K) d, d
10.1.5 打包测试 63) g( S/ A" Q Q# C' @
10.2 业务代码封装 65: y) ]& j6 T6 J4 o d# {$ N9 I
10.2.1 通用CURD接口 65( U# v1 C$ m: K- G6 E
10.2.2 分页请求封装 66$ R* Y. u2 [) B' O1 m
10.2.3 分页结果封装 67% q, P+ s: Z) @- ?
10.2.4 分页助手封装 68
+ d) [! S1 F* H9 b10.2.5 HTTP结果封装 69
! F& M- w j, z4 H10.3 MyBatis分页查询 70
$ t5 X. y5 k- P/ P10.3.1 添加依赖 70( O, {! L# x; H+ E/ G' l$ j6 N1 `; i+ ~
10.3.2 添加配置 71# O' V2 T, w$ E* b
10.3.3 分页代码 71, ^" k7 N7 F- h4 t! s
10.3.4 接口测试 73, g7 j8 P' }3 P
10.4 业务功能开发 74 b5 v% n( ?, F2 y
10.4.1 编写DAO接口 742 |4 y1 `% z2 G8 N" ?2 P+ A
10.4.2 编写映射文件 74
6 G# x0 f& q% y9 X& K10.4.3 编写服务接口 75
V+ i( Y4 `* U3 H# z10.4.4 编写服务实现 75
2 p9 D$ L. o( O0 u* L/ x10.4.5 编写控制器 77
6 I( L! h8 i X" A/ `10.5 业务接口汇总 78
* a. Q4 O( Q6 D4 p( X; W$ f10.5.1 用户管理 78: R% c. a0 i! V6 j% u
10.5.2 机构管理 79
# P) f* y- u* t1 b6 `! |( V10.5.3 角色管理 79
: M1 G/ l( o- `* N. ? }* n; B( U10.5.4 菜单管理 80; `: n6 f2 [# C1 q. L( ]6 ?
10.5.5 字典管理 81
6 [8 k b1 j& F% z10.5.6 系统配置 82# A A; F- U" U# L$ C5 {
10.5.7 登录日志 82
' i2 E; l: }* t+ B( L5 G10.5.8 操作日志 83
4 T& q! T, s& S8 L. R10.6 导出Excel报表 83
1 G2 B4 J# X$ t1 | w/ n) y. ]. ~10.6.1 添加依赖 83
0 U. o5 g0 t c) i% z10.6.2 编写服务接口 84
; G- o, k8 j: U7 L10.6.3 编写服务实现 84
0 `$ G7 ` `0 A3 i10.6.4 编写控制器 85% @% }. b8 _& k: l# X* b
10.6.5 工具类代码 86
6 T. Y- v4 ]% `6 \* @10.6.6 接口测试 87
& _2 [! K9 U: Y; J3 L7 N第11章 登录流程实现 890 ?* K- J) u4 R. j* }
11.1 登录验证码 89, [; f l5 B: {% e* c2 s
11.1.1 添加依赖 896 _( B F5 A) c3 m6 \) h
11.1.2 添加配置 890 p/ n' f7 v$ G& i, i
11.1.3 生成代码 90
7 i* I$ [+ D* J% J, Z11.1.4 接口测试 91' S0 K& R( ]8 l$ a
11.2 Spring Security 915 A& x( ^5 e0 G# F
11.2.1 添加依赖 91
9 m$ V! ^0 ?. K: a' E* x11.2.2 添加配置 92
6 [* G4 N- \ y# }7 a! f. Y: e11.2.3 登录认证过滤器 93
8 b% i3 L- ~4 m, J11.2.4 身份验证组件 960 e. g+ @/ S2 {2 S; N6 l
11.2.5 认证信息查询 97% u& _, p) x6 h) _ ~
11.2.6 添加权限注解 99
$ T6 ~* K& ?- M$ L11.2.7 Swagger添加令牌参数 100
k6 G9 P$ @3 A( L+ g9 F, w' N11.3 登录接口实现 101+ x; p1 h+ o+ r( m$ @4 A& j
11.4 接口测试 105
! t2 l3 L) O( ~+ a11.5 Spring Security执行流程剖析 108; g; c9 J: p3 l1 e/ ]
第12章 数据备份还原 109$ _2 I% b. v2 b" e( e; F
12.1 新建工程 109* {3 Q; H4 {8 {
12.2 添加依赖 109
) Y7 t# o% I/ t# T8 n9 g9 r$ x12.3 添加配置 110
: F& B. c: Q* L' {- x- i% o* Y1 i5 h" a12.4 自定Banner 111& L& M, g, u6 G- M0 t. s
12.5 启动类 111
$ o/ P) J& G1 p7 g12.6 跨域配置 111
5 t$ I8 y) s A4 E12.7 Swagger配置 112
/ [4 m0 w: x: S1 L12.8 数据源属性 112' c8 } w0 l" N8 b( _6 V
12.9 备份还原接口 113" p! u O( R* C/ ?6 ?9 g7 O. n
12.10 备份还原实现 114
( G* Q3 b- v+ t7 A12.11 备份还原逻辑 114
3 W: g" ~1 V* |12.11.1 数据备份服务 1157 I1 p( g/ S( J& S4 X
12.11.2 数据还原服务 116
" N& B( a' L3 H12.12 备份还原控制器 117, W3 e0 [1 s& E- ]- E9 |0 k" c3 y K% {
12.12.1 数据备份接口 117+ z$ o/ G4 T" }$ b# e
12.12.2 数据还原接口 1175 V1 D7 S* o3 g2 x) @# K
12.12.3 查找备份接口 118
2 j% C. k1 z# f. L1 i. Y4 w5 A12.12.4 删除备份接口 1198 S. _( a# W0 J$ j( X1 ]7 T' m
12.13 接口测试 119& P7 j0 J' P4 ?+ n d
第13章 系统服务监控 1231 c" s& f0 Z* m# U) r; Q; I
13.1 新建工程 123
! Z/ Z+ h* e0 X0 [6 d13.2 添加依赖 123# y+ s3 h: m+ n5 G: |
13.3 添加配置 124
6 _4 P/ s) P2 M! b- R13.4 自定义Banner 124
$ m. `$ `: _7 D! r! M- z- i13.5 启动类 125+ ]: {7 ~+ J' { g; F+ F
13.6 启动服务端 125
/ V& v8 F5 r6 k# C) _- B6 [: G13.7 监控客户端 125- ]: f+ y- b3 O7 `$ P D% Q/ c9 ^
13.8 启动客户端 126
" ? e( ]/ G7 s$ P0 b第14章 注册中心(Consul) 128" X$ |6 U% r3 C, K3 B5 b0 K' W
14.1 什么是Consul 128
' D$ K3 u) H, Y* }14.2 Consul安装 128( G1 o% e5 w. O `% d9 @) F
14.3 monitor改造 129, [- T3 N& m6 z& ~
14.3.1 添加依赖 129
' N4 g- C+ x! {$ y% @$ T14.3.2 配置文件 130
4 L. Y& r3 |( A0 S14.3.3 启动类 1303 R* c8 r6 w4 U" }, S
14.3.4 测试效果 131, v$ V( l H' t+ r/ u0 f( ^* i" |
14.4 backup改造 1322 K$ @3 V# a9 K5 E: Q
14.4.1 添加依赖 132
/ M( V7 b/ P" Q3 U& r% ^14.4.2 配置文件 132. v$ J" B* b: f# J2 E- }6 Y
14.4.3 启动类 133
: o% N! s3 j# o: s4 `14.4.4 测试效果 134
. ^& z" p7 r2 m8 `$ x- P14.5 admin改造 134
' H. X$ U! \- P. b8 G9 z2 n5 b6 {14.5.1 添加依赖 1346 w) I! e; w- B4 T- p* K" e8 K
14.5.2 配置文件 135
1 y2 Q" K0 o4 P% a0 I2 s$ j14.5.3 启动类 136* A6 V& P6 C4 ]$ E
14.5.4 测试效果 137/ f, M0 P# f+ d; ~" V
第15章 服务消费(Ribbon、Feign) 138
, a! D& B9 J* H' o' `5 ~15.1 技术背景 138
+ X3 p5 _, z+ d- m! a' @15.2 服务提供者 1386 U. d& t2 X0 [" e
15.2.1 新建项目 138) ^' i# `4 j6 p
15.2.2 配置文件 139
) \! ~( D3 W& a" h15.2.3 启动类 140
: n1 |2 s: Y8 p7 q5 ^' f( S15.2.4 自定义Banner 140" }3 S% E1 \& d& o+ ^* S
15.2.5 添加控制器 1408 p% z3 R+ Z# x3 e' G7 S3 V
15.3 服务消费者 142
' D6 {3 L. V9 m( }. A- P15.3.1 新建项目 1420 O& P. X* v$ B: g' s( g
15.3.2 添加配置 143
! u3 C( x$ u: D. a15.3.3 启动类 144
_" V8 ~: D! y* u' c* `, E15.3.4 自定义Banner 144! Y8 M8 E" ^& t/ f
15.3.5 服务消费 144
+ b" w& ]8 W/ K3 v15.3.6 负载均衡器(Ribbon) 147
! u! m, g# ?. L' ]% D% |15.3.7 修改启动类 148+ a& W! h8 I# l3 p+ v. N, F
15.3.8 添加服务 149) @* @9 m1 C( E9 l
15.3.9 页面测试 149
2 E6 a: n' b# r. B! z& t* `15.3.10 负载策略 149
! T. g" z+ V P' ? ?" E1 A6 y6 n15.4 服务消费(Feign) 150& w7 K" O4 I5 `) h. Q
15.4.1 添加依赖 150" b0 I6 q9 B7 N. s2 K' s; w( M( m
15.4.2 启动类 150
( N, @+ w+ w8 r( J4 I15.4.3 添加Feign接口 151
+ W* t2 S2 I3 Q5 J) v15.4.4 添加控制器 151
& w+ t1 s/ l. S5 O' D15.4.5 页面测试 152
u S B" w; M3 A7 s( m第16章 服务熔断(Hystrix、Turbine) 153
$ B3 s2 m, y# E1 n# W( q( o16.1 雪崩效应 153
, L2 w2 c( u$ I: }16.2 熔断器(CircuitBreaker) 153
# B1 Z2 o, W) z w16.3 Hystrix特性 153" a! u$ U4 s( L5 B' J% n: j' d; G
16.3.1 断路器机制 153
' Q+ m" m* \) j$ D i% R6 x6 M16.3.2 fallback 154
2 f# m6 l4 w' v8 G- i/ ]3 v16.3.3 资源隔离 154: i# m) F1 ~) J0 T% p' Z
16.4 Feign Hystrix 154# H0 w: q/ w6 O1 y, f, K
16.4.1 修改配置 1546 C! z9 l% h+ C# a& l
16.4.2 创建回调类 155/ K) U( Z" M; Q) q) z
16.4.3 页面测试 155
9 h1 E: ], z' M7 M16.5 Hystrix Dashboard 156" k1 s+ H) k. z1 ?4 i0 ^
16.5.1 添加依赖 1564 S$ `( d& ?; ^" d6 r0 q- K
16.5.2 启动类 157' ~6 A, a; M* v& S9 X* p% S
16.5.3 自定义Banner 157- d$ w* h4 {, `0 y! ]. b' C
16.5.4 配置文件 158! A" l. |+ L: ?7 ?& c* q8 S" K
16.5.5 配置监控路径 158
5 ?' E6 N4 \* y8 d7 J3 _16.5.6 页面测试 1590 e! k q2 t4 n. c2 t$ C. t
16.6 Spring Cloud Turbine 161
- P- D, w P R- ]& H16.6.1 添加依赖 161
1 l4 d+ E0 v9 e$ U- z' J" E16.6.2 启动类 162+ s1 {. v6 U% V3 @! |% l8 L6 I
16.6.3 配置文件 1629 A! A u% b8 f
16.6.4 测试效果 163
$ `9 h3 s& [' K9 S第17章 服务网关(Zuul) 164" t+ Q1 i+ ?5 J
17.1 技术背景 164* r; h; C1 ^+ M: `3 J+ l( y- l2 V
17.2 Spring Cloud Zuul 164
8 q3 a" ?& X. r' _17.3 Zuul工作机制 165
: ^4 k! d. U; Q17.3.1 过滤器机制 165
Z/ s3 T- d: d/ Y17.3.2 过滤器的生命周期 165
' U$ w6 R z& L! t17.3.3 禁用指定的Filter 1676 [! a1 }4 }8 {# i2 D& p0 S
17.4 实现案例 1670 B2 l! L/ V) M: L3 `# q1 _! _
17.4.1 新建工程 1678 q# y$ z6 n1 K' E5 a! T6 Y
17.4.2 添加依赖 168
0 Y2 S/ [- R. d" v17.4.3 启动类 168
1 u: M+ h) p4 j7 N3 M0 ]& z17.4.4 配置文件 169. w- Z7 B" S# K7 p$ \7 p9 M$ H- e# b
17.4.5 页面测试 1694 a! u) ?" V, y1 z# o2 _
17.4.6 配置接口前缀 170: m, Q/ h5 a3 F3 C/ b) s3 m
17.4.7 默认路由规则 170! g* G$ U# z2 v' C3 W
17.4.8 路由熔断 1719 _5 ^& I. l0 J' z/ m
17.4.9 自定义Filter 1722 X' @; k N" s6 Z" R" G& T
第18章 链路追踪(Sleuth、ZipKin) 174) o2 {3 M7 V T: H- I8 ~+ Z. B
18.1 技术背景 174
- b1 U# |" r% Y1 \" \: V18.2 ZipKin 174) A' g: t9 C: [& L% W! L" P9 A
18.3 Spring Cloud Sleuth 174
5 I1 `4 K( Q# {. Z18.4 实现案例 175
3 G( d2 ^2 H/ i3 V g) \0 _18.4.1 下载镜像 175; y) l' {" { G4 }" b
18.4.2 编写启动文件 175
6 G f- ?9 N8 P' [18.4.3 启动服务 1763 t& }. {. a! ~. E& Q9 k$ x
18.4.4 添加依赖 177
v( g2 l2 d& W- A7 t% t18.4.5 配置文件 178' s2 V7 o1 X. t$ Z* I
18.4.6 页面测试 178
7 w B0 m# I0 l- L. F1 v1 k第19章 配置中心(Config、Bus) 180
1 [$ ]8 A+ [% M8 \. \+ p- r" W) B19.1 技术背景 180
2 d. E0 ]9 f% a- g* A+ _19.2 Spring Cloud Config 180
+ }3 r4 @) e4 T19.3 实现案例 181
: I `2 X7 a, P% `4 {19.3.1 准备配置文件 181
% s- W* |$ x. s$ z. P% I19.3.2 服务端实现 181
. ^% _2 Z/ g0 T. Z& R- q. ]* C% b2 V19.3.3 客户端实现 185( w. R' F6 |$ K1 X q1 O# z
19.3.4 Refresh机制 188
* s0 [# Y8 j+ D2 z4 z2 \: i- \19.3.5 Spring Cloud Bus 191; k6 |4 d h% k- C) }; d
第三篇 前端实现篇: t1 n- s! W# z9 O' N, m
第20章 搭建开发环境 201, s8 ^9 q A* `' \
20.1 技术基础 201( [) M+ h0 _3 B& P& E
20.2 开发环境 201
8 ^7 ~+ i2 `7 M5 R3 t, p, b; Y; P20.2.1 Visual Studio Code 201
0 S; ~! v; p, J" L1 B9 F k! ^" W20.2.2 Node JS 202
( d b9 Q$ Y% J3 F) w" S! A20.2.3 安装 webpack 203
L! |; T) d1 S! |4 x+ K% ~20.2.4 安装vue-cli 203
8 v' U/ o) N9 |* i% F20.2.5 淘宝镜像 2032 D+ f7 i/ ^/ @, Z
20.2.6 安装 Yarn 2038 p# D" o* D3 F* X0 t; k
20.3 创建项目 204: L( p; Q$ [) [% C5 B
20.3.1 生成项目 204' o! Q4 O/ V; l2 q5 j8 Z. A! J/ D
20.3.2 安装依赖 205! o. S* L6 ~4 f+ b9 E! q; P
20.3.3 启动运行 206
' X0 y$ B/ l( [2 C第21章 前端项目案例 207
; h& J. H- K3 P; q' |21.1 导入项目 207
4 _$ d( [9 Q& j5 l. U8 @21.2 安装Element 207
. e' n( L8 T' f: H+ K: y( ~21.2.1 安装依赖 207
, G y ]" x+ x4 \2 F S7 |& `21.2.2 导入项目 208
0 d. S" t' [8 L- V8 P21.3 页面路由 210
3 d2 T6 t+ J9 z" ^ l1 l- g21.3.1 添加页面 210
^1 M+ T `4 w21.3.2 配置路由 210
& ~) ^5 T: Q/ R% O0 T21.4 安装 SCSS 2129 n, y9 m2 U, |4 g7 Z
21.4.1 安装依赖 212! u! y5 ~; J3 ~6 t! r4 C, |
21.4.2 添加配置 2120 x2 E, K$ W' N I2 d
21.4.3 如何使用 2121 `0 l4 |1 u' c: \% z* r* c' l* d
21.4.4 页面测试 2129 B5 d! L8 i1 o
21.5 安装 axios 213$ T; V; `9 v q+ q( B5 `
21.5.1 安装依赖 213
& k) I& E" p4 m" l P+ M21.5.2 编写代码 213
) D* X3 ]) n+ o9 J) V7 n4 Z- Q21.5.3 页面测试 2147 r7 |+ J6 m+ ] D' X$ P* J
21.6 安装 Mock.js 214
" I2 o( j' }9 x, O$ M21.6.1 安装依赖 215) b$ @ e. U2 _1 I2 O! S4 M
21.6.2 编写代码 2157 `# `) L1 J$ t" d' |. v
21.6.3 页面测试 216
. r- S* e. n3 S第22章 工具模块封装 217$ R( ~& b1 O0 v# }! u
22.1 封装 axios 模块 217
`2 @4 y4 n! `8 J3 h22.1.1 封装背景 217: [+ M6 ^& k0 i: p( m, {
22.1.2 封装要点 217$ ~. c5 @! j, _+ y& f0 n4 a2 b
22.1.3 文件结构 217
: @" }* Y% C( j/ m* i h22.1.4 代码说明 218! a2 o! `- m! @* _
22.1.5 安装 js-cookie 2225 ]) h" P" u1 ~1 n) P
22.1.6 测试案例 223
' o9 X; N2 ^) p22.2 封装 mock 模块 225
, t) Q: l1 P6 X" k a Y4 {22.2.1 文件结构 225 D. }- _! k2 \$ N
22.2.2 登录界面 228
( ^7 }; h8 w6 r1 E' Y% e22.2.3 主页界面 229( e+ K# d' v+ V
22.2.4 页面测试 2290 P* V- @. p; i
第23章 第三方图标库 230% I" I! i/ t2 X
23.1 使用第三方图标库 2308 {0 T7 w* z6 O* j/ O2 G: n
23.2 Font Awesome 230; k3 o9 q8 f: F
23.2.1 安装依赖 2305 F9 E" {; a6 S D+ n8 A
23.2.2 项目引入 2309 J% T; ^7 h+ D7 ?0 c
23.2.3 页面使用 231
" X6 j+ [. K. }) j) y23.2.4 页面测试 2310 t/ M( r f( V8 \/ e4 Q
第24章 多语言国际化 232 f7 K0 o+ n! m* a* J. o
24.1 安装依赖 2320 j& r& D" L! T' C/ I& ]" X; m
24.2 添加配置 2329 }4 ]7 Z' m+ v- ]/ l
24.3 字符引用 234
& ]8 a8 g3 }" R5 z7 {24.4 页面测试 235
) \) h! ]- i+ R, I0 p4 ]第25章 登录流程完善 236
g' m0 B3 N6 U( g, ~) n25.1 登录界面 236
6 T$ p+ U8 e7 G; \- {25.1.1 界面设计 236
5 z, p0 h w. E' u* P25.1.2 关键代码 2363 F5 q2 s3 m; k8 a* I1 a
25.2 主页面 237
6 I0 A" r `7 d0 V+ O25.2.1 界面设计 237" J; B$ M# F/ L1 r* r5 H5 s+ i
25.2.2 关键代码 237/ B0 s9 l( G, A' O, \1 `& V7 z" ^
25.3 页面测试 240
+ j, g9 f* N# q0 N3 i9 O3 `/ _第26章 管理应用状态 241* m- x6 {! H+ p) j1 B5 B* c
26.1 安装依赖 241
3 [1 W4 z" \4 u) a1 y+ x$ o26.2 添加store 241
8 A% m v( G, B! p" C. G' C26.2.1 index.js 242
( _$ l3 P& t* |, V26.2.2 app.js 242
' H2 F- i5 R2 m8 n* q G: v26.3 引入Store 243) V3 a3 A) u3 f4 s
26.4 使用Store 243" F+ t" r+ G+ w; A7 F- G C
26.5 收缩组件 244
' g; V/ \7 p4 `& d; q26.5.1 文件结构 2448 {2 Q: i9 k1 b2 F" D1 i
26.5.2 关键代码 2440 f: u2 T5 v3 n: I9 T) s) w- A
26.6 页面测试 245
/ R, G- L+ m0 W2 f) V& ?第27章 头部功能组件 247
6 E, J5 ~- x$ \27.1 主题切换组件 247
E6 Y( W9 W6 c4 {/ ~27.1.1 编写组件 247
( `7 e$ j8 t; L+ z27.1.2 页面测试 250
! t6 S U/ y( d E1 O27.2 语言切换组件 250& R' i9 E: h% S# C( Y
27.2.1 编写组件 250: ^' e" Q0 k( X( o8 q
27.2.2 页面测试 251
" Y! r; e. S3 K3 ] C2 F( P( \& V0 v27.3 用户信息面板 252
; x6 F5 B, R* }1 C27.3.1 编写组件 252
' {1 X5 y6 ]- B1 @ e27.3.2 页面测试 253
7 Z3 b) c6 i5 m7 X2 {; A% z( ?- I9 ~27.4 系统通知面板 254
: V8 B7 n6 X) \( R, a% L b27.4.1 编写组件 254
, n1 t/ A' R2 ?4 F! _0 k27.4.2 页面测试 255
2 r9 \/ t5 O; t* f8 X1 B/ I27.5 用户私信面板 255
5 v3 M2 Z4 i1 N' z v27.5.1 编写组件 255
1 E; B; ?+ f) G9 X$ L27.5.2 页面测试 256
4 C7 B8 B I/ Z第28章 动态加载菜单 258
# Z* F3 E) x6 U1 n. r$ ~; e: q28.1 添加Store 258
8 N& q6 p$ ?' x. s' A; x4 x) g28.2 登录页面 2597 f3 A# U) i2 U, R+ A- f
28.3 导航守卫 259
4 o) M7 c' x# U+ U28.4 导航树组件 262# Z; z1 n! O* t6 i J) W5 v
28.5 页面测试 263
7 e! r( } V% z: Q7 |9 i第29章 页面权限控制 264
( k+ f5 s6 l' q5 s7 a8 y9 {29.1 权限控制方案 264
# z" p- Z, i# t( ^3 L& w29.1.1 菜单类型 264
( `% e/ \! D0 Y3 p( w29.1.2 权限标识 264( p8 t. Q% O$ E/ F
29.1.3 菜单表结构 264
: I( g8 u" ]7 x2 Z4 {# ?29.2 导航菜单实现思路 265& J; J. q+ O1 K" i' z; e; ]0 p
29.2.1 用户登录系统 265, c' ]7 p9 { B* n0 w
29.2.2 根据用户加载导航菜单 265
' @( Y- e" I& j! h, N29.2.3 导航栏读取菜单树 2651 o' E& U* x$ i1 V
29.3 页面按钮实现思路 265. j: h% I3 v& I3 |- C& V) f
29.3.1 用户登录系统 265, ]5 `- e! D% _4 a, P2 ~
29.3.2 加载权限标识 266
/ }$ \" X- P" _; l, f" W& @) b% k- e; |29.3.3 页面按钮控制 266
9 k% z: u5 Y% E4 H29.4 权限控制实现 266; L& J" L* g0 W, P6 G1 u. n$ D. _
29.4.1 导航菜单权限 266
6 j' g4 C! y* S29.4.2 页面按钮权限 267
; i- w! m& R; `. A! V0 q4 q4 c29.5 标签页功能 270
: x# g5 G% |* y4 B: n* Q, z" t29.6 系统介绍页 2732 N& |1 _2 T' I6 X
29.7 页面测试 274
2 n( d- m1 |1 r1 ?2 I v! |第30章 功能管理模块 2762 F1 B# ?4 K) }) W' |5 M. [6 _% H. n
30.1 字典管理 2763 X0 |. O1 I% N! ?5 @
30.1.1 关键代码 276
, Y" g9 \1 {# C/ [! k30.1.2 页面截图 279" s9 y \' _9 |. D
30.2 角色管理 279
8 _& R6 w4 Y# o& t" R9 D30.2.1 关键代码 2793 \/ J9 `4 k5 j+ @+ ?) _7 B
30.2.2 页面截图 281; A. ?# v4 W. S( c! C' `" y2 ?
30.3 菜单管理 281
" |$ v, u+ s+ ^0 z8 o30.3.1 表格列组件 282. {: j6 }: d7 m% Y+ @) Y& F/ C
30.3.2 创建表格树 283
- u/ ~" [% D" r- X) v1 M$ y30.3.3 页面截图 284+ ~9 C% s/ A, M
第31章 嵌套外部网页 285 F6 d9 V7 _5 H+ q
31.1 需求背景 285
* z2 v" D" ^, P# V- }7 {31.2 实现原理 285
' v$ N. R8 n6 W! E) C U! T31.3 代码实现 285 U$ [" }4 n- R# N: n* n; Y: N+ O
31.3.1 确定菜单URL 285
; n/ w% Q# [" R {$ J" n1 y31.3.2 创建嵌套组件 287
- {/ }( `# W/ E31.3.3 绑定嵌套组件 288
' Y4 ^4 X# j. M, P- d0 h31.3.4 菜单路由跳转 290) j2 F3 O5 c {! y' W; M( R1 N: s
31.4 页面测试 2903 ?. X2 ]) r! Z4 Z9 _8 y
第32章 数据备份还原 293
1 u* X$ J% y4 ^. D32.1 需求背景 293
' ?5 @& F9 a6 O1 ^! `32.2 后台接口 293* x8 `& J' e9 p
32.3 备份页面 294. ? Q' m* z- o4 W: F! @- b1 d
32.4 页面引用 296* [* @5 Q6 s) f: H6 h2 L/ h
32.5 页面测试 298