|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。. `) a+ b, O: X! B5 }
课程目录：
& d- {; S5 B5 Y& \! Q9 A01导学8 {5 u/ j; M+ R
导学(12分钟) . M2 h* w) G! ^, x. W
学前必看！补充课：接口调用参数补充(6分钟)
7 B8 n6 P7 ? V8 P m! q 基础框架NextHelloWorld(rar，513.7KB)
" X7 a7 Y# g7 s, M. l p7 }6 l 超英预告最新源码(rar，8.7MB)% B6 j6 w0 s( [/ m+ ^) R/ Z; K1 ^
linux工具与ngxin安装(rar，37.3MB)
h' N& Q! s3 l logo素材制作(rar，730.3KB): }% ]" d2 n0 ~$ K/ Y
02课程介绍
! R u/ s G6 [1 D. S- G+ C 什么是 uni-app(4分钟) D2 L6 m9 d6 R" Y
为什么要使用 uni-app(8分钟)6 }) L" B( q) N( s& Q
app多端发布效果展示(7分钟)4 W. ~4 Y; R/ S/ v
使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)6 R; D7 N1 V0 R# r
微信、支付宝小程序开发工具调试(7分钟)
1 J% V/ M; g% @+ c9 K/ G+ y c 在Mac上使用Simulator进行调试(5分钟)+ |4 M. N) E; W1 T2 q
03框架基础-上; L" J. m/ x& W
简述MVC模式(9分钟)& l+ P. o4 \. Z( N$ G
图说MVVM模式(5分钟)5 f3 T' E( G" Q& i. R4 X
通过代码阐述MVVM与双向绑定(12分钟)
! H5 u3 M0 X4 L6 M JSON对象和数组的渲染(4分钟)
" m& `. r7 @4 w* |3 Y. | 页面路由以及标题配置(11分钟)" S [+ b$ ^ q7 e% u2 q/ U
宏观讲解项目配置文件(16分钟); q* H# |# w% o4 s1 N |! x7 g
应用的生命周期(11分钟)
8 z, f5 h% g: X, u2 s6 v+ v 页面的生命周期(14分钟)8 r# Q$ L0 G1 U2 F
固定像素px与响应式像素upx(12分钟)
. v# @4 B: b& U2 @* n) o 在页面里使用{{}}表达式(7分钟)
' Z) N' `% J4 ^* N8 f. p04框架基础-下0 E) g& [' [4 x( _5 b( h
v-bind指令对属性的数据绑定(7分钟)
% W+ u3 G/ Y3 _; ] 事件基础(22分钟)
' S- U; T G9 s: c 条件渲染 v-if与v-show(7分钟)& y) T( o* E/ V( l; f6 E& X: }9 W
条件渲染 三元运算(4分钟)
9 B" s$ i( U3 `% V+ [9 k* B; Q: e; { 列表渲染v-for的使用(13分钟)
' |& O! v# ~' u) }3 x 指令key实现for循环的组件唯一性(12分钟)2 u0 q0 p' L1 W$ l( k1 n
嵌套循环的下标定义(4分钟)
: A# B7 r* b; Y 条件编译 - 上(10分钟)
+ h5 y( `* T9 {! t" O- n 条件编译 - 下(7分钟)
' q" ?* r/ t2 ?% ^2 {05样式与flex布局-上
7 G4 N- D* L, g# t4 h" v9 s4 t& q5 b flex布局介绍与模型(8分钟)" S! @0 B( a2 \$ c3 W6 n+ ~
flex-direction 元素的排列4种方向(10分钟)
3 b1 F7 B+ z. B% h 导入外部css样式(4分钟)
3 ]4 ~$ R! n+ U flex-wrap 元素的换行(12分钟)& z& O2 F; \2 t% ~& i* I
justify-content 元素在主轴的对齐方式(14分钟)
2 [( y5 g1 K! u8 M0 f align-items 元素在交叉轴的对齐方式(12分钟)
8 ?5 j# \2 }9 K% u06样式与flex布局-下8 L/ B% S. m n0 h6 ^7 U# I0 H
align-content 多轴线的对齐方式(13分钟)
% x$ L" t- u& E4 t2 U( W% n flex成员项的属性 - order(4分钟)" h6 `5 t0 E0 X z
flex成员项的属性 - flex-grow(4分钟)
1 f4 B! S0 }# `4 t* N flex成员项的属性 - flex-shrink(6分钟)) Y! c0 ^. \0 P, a, E5 k& p
flex成员项的属性 - flex-basis(4分钟)
$ q" M! F' n% e: Y flex成员项的属性 - align-self(6分钟)
: A# J: u+ g8 c4 H+ D+ b" |07开发首页-上
8 c; B3 h7 G/ ? Q 创建项目，构建基础页面(8分钟) 免费试学& f/ M# j/ _; o% J) n% L
构建tabbar(13分钟) 免费试学* W5 m8 B$ L. t$ X5 b: v+ z
设置全局page，简述view组件(6分钟) 免费试学/ q0 m# G$ ~/ v5 W9 m Q7 j
使用轮播图组件(11分钟) 免费试学/ u/ G' n* @+ W( x* o9 a8 ^9 w8 D7 Y
禁用原生导航栏达到页面全屏化(6分钟) 免费试学
# k8 K4 Z' b$ L* B 在线文档的使用(8分钟) 免费试学
/ {! W$ I/ J: _" i request网络请求api讲解(5分钟)
, E/ d: C, q0 {# N uni.request动态获得轮播图数据(9分钟)
1 P$ v7 f/ }+ M# Y2 z# L 箭头函数 this 作用域(4分钟)3 Q$ @' l) T# w* _6 d& W! `
渲染并且展示轮播图(5分钟)
0 Q; V* k+ S/ ?$ `08开发首页-中
6 F l7 |6 H" z. a) l6 J- Q 引入组件实现全局变量(7分钟)( b3 |1 |; Q( |2 Q' {
使用挂载实现全局变量(4分钟)
8 V8 i7 P: x6 { 在手机端进行微信小程序真机预览(6分钟)
3 W5 f& f2 S7 X; R" n8 r+ M/ R# O 微信小程序https使用事项(7分钟)
# ], ], w* w# z& v 开发热门超英 - 标题(9分钟)
. Y6 }1 q' f) f1 S' p 开发热门超英 - 简述scroll-view(4分钟)
' s' J5 F0 p% x) ^% S* v; E' J 开发热门超英-使用scroll-view实现横向滚动(3分钟)
+ I/ E) Y0 v7 s 开发热门超英 - 海报与标题(8分钟)3 {9 ?- \, R: Y- L) b
开发热门超英 - 评分(6分钟)0 J; d/ `4 |$ _
开发热门超英 - 动态渲染数据(8分钟)) R: M2 B3 a6 O; t! @
09开发首页-下
: }4 v) |- h( \; c& W9 Q 开发自定义组件(7分钟)" S0 Y, G8 `8 d) q- d7 c
父组件向自定义组件传入值(6分钟)3 h+ A1 y: i2 N/ o" }& f
完成评分自定义组件(22分钟)
, @2 C+ E) g K; O) v0 X 视频组件video讲解(9分钟)- G& i, }3 X4 a+ e5 u( C& J
获取预告片数据(3分钟)
) r3 C$ D* o, r! ]+ I 动态渲染预告片(10分钟)
' O8 O0 w7 j) H8 x' P( t 猜你喜欢 - flex布局嵌套编写(18分钟)- Y w c4 [; b q
猜你喜欢 - 编写点赞css(7分钟)
! K9 P6 t) o" r 猜你喜欢 - 实现点赞动画效果(14分钟)
3 h" I# K/ m8 Y 猜你喜欢 - 还原动画(5分钟)
# }1 n, Q4 |5 @+ @10开发首页-终0 E$ l/ E5 b% v: Z' E l4 T5 X7 ~( P
猜你喜欢 - 动态渲染列表(6分钟)5 Z- }# p7 i. i/ A
猜你喜欢 - 实现动画数组(7分钟)
- G1 @: w# A3 H0 { 猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)
, k) o! `, i# @8 }' F 猜你喜欢 - 开启下拉刷新(5分钟)) |( |. W: S i. p& S5 o; @
猜你喜欢 - loading交互api(8分钟)- ]/ h6 h- ^2 X, N% @& |
11构建搜索页-上; ]# Q+ D; G, Y0 N4 B9 E4 b
搜索页面 - 编写搜索栏(19分钟): A% l6 R! d8 r" o
搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)
8 L1 M4 p$ W+ I* \, ^7 s4 H 搜索页面 - 动态获取最新预告并且渲染(9分钟)
& ^+ p' i2 R5 e9 ~) O4 {' C' [ 搜索页面 - 分页接口api讲解(4分钟) m* K5 R# s) l% f: E- s' t
搜索页面 - 搜索前置准备(6分钟)& g9 }9 f8 [9 F1 [ `
搜索页面 - 执行搜索动态渲染(8分钟)
: H9 Q7 J Q, n 搜索页面 - 监听下拉实现分页功能(8分钟)
}( b% `1 m6 O& t: P& C 页面路由api与传参(13分钟)
0 |* e3 b! S/ o7 u* U 页面跳转组件的使用(7分钟)
- i4 [! [8 f( Y5 q" V. B' i0 j. ] 详情页 - 查询详情与视频渲染(8分钟)
" K L: R* o: }0 N# K0 {' p" w5 p7 y12构建搜索页-下
5 t: K/ V, z* ] 构建预告片基本信息(16分钟)
2 q. F# b0 c4 w9 d 构建评分快与阴影效果(15分钟)
* J: v4 T( @ ~ Q) ? 解决错误数据绑定undefined(5分钟)( W( x* |0 G9 k% y% T( E! G* h
编写分割线以及剧情介绍(8分钟)0 x9 I. f. {' J9 C4 g2 @1 H2 [
构建剧照与演职人员数据列表(10分钟)% R6 Q# I) [; Q. O
渲染剧照列表(8分钟)5 T, j" J5 U' k3 P2 y
双拼数组构建演职人员列表(12分钟)! l' X$ m h/ q( w* x( v3 C0 j
渐进式导航栏设置(6分钟)" I# d: Z- d k& T
通过预览api实现剧照预览(7分钟)
" a. j( i( V8 [2 \ 演职人员数组拼接预览(8分钟)
- P$ \4 m) |1 b( @* ], u2 j2 y13电影详情页构建! |) T! s9 X4 ?) p5 |& L8 v
自定义预览封面图(13分钟)% I! C5 S7 X+ |3 M5 f
actionSheet接口api使用(6分钟)
# k, @; O! ^# k& L 下载以及保存图片(15分钟)( a3 M4 f+ v8 f4 I
配置https下载合法域名(5分钟)
) a9 A7 D; h/ k: n- k, ~ 实现小程序中的分享转发功能(9分钟)
. R8 N* V8 G) T) d) F* Y 自定义导航栏按钮(11分钟), R8 C8 {! h& Y
分享到朋友圈(9分钟)) V* ^* s: J' n: ^& Q
微信开放平台简单介绍(6分钟)
4 `: s/ e/ ~3 A% x 操作视频对象，提高用户体验(8分钟)
4 B6 X& B5 t+ K& s7 I) } 优化首页视频体验(13分钟)* w) j9 m& X6 k- c" d' X
14我的页面（上）
8 j0 m4 G1 F0 t* {- L 开发个人页面-header与导航栏设置(9分钟)
5 L# V L/ L, ]4 }6 m 发个人页面-用户未登录和已登录的页面展示(9分钟)
5 W) g- n( ~4 R 构建注册登录页面(8分钟)
+ d! d+ w" j- I0 j3 g( E; C button与form组件讲解(6分钟)% }+ b4 c5 I* T4 ~
实现一键注册登录(12分钟)- j7 x& @3 [3 ^) u8 }
通过缓存切换是否登录状态(9分钟)
- S9 ^6 W9 [2 T4 t 构建用户账号页面(9分钟)
' e" r% x) i: I) `- i' g 清理所有缓存api(4分钟)
& \* j2 _* ^6 n# r* j' v: t+ x- Z6 ? 用户登录错误提示与方法挂载(7分钟)" X( p: q1 N0 x/ F0 o0 o) C
渲染用户信息数据(6分钟)9 \1 B) b# E: G
15我的页面（中）3 }$ h4 C! Z. t
用户退出登录(6分钟)( `6 C6 M. I; T" U4 j9 J
第三方登录讲解与页面构建(16分钟)
0 ~, `+ |# q' ~7 d" ]* ~2 G! g* e 第三方登录-小程序端实现微信登录(15分钟)
7 d' j! V% B7 d5 v 第三方登录-后端登录业务梳理（辅助理解）(10分钟)
/ L; D( K- F9 ]; s S, G 第三方登录-app端授权登录(8分钟)* } p7 T9 V# [1 N# C# \6 [% u0 z/ U
第三方登录-app端获取用户唯一id及信息(12分钟)( |8 W" q4 Y m5 n i: D/ R4 ^) X
第三方登录-app端执行一键注册登录(7分钟)
$ ^: A0 T. G! M/ u/ R 查看预览用户头像(7分钟)6 q i* z7 f' x, l( I* i
选择用户头像(11分钟) H) j( s: M4 K/ [( q) ^& B) T4 Z
重新选择头像(3分钟)
9 s0 G2 @% b, t! N6 `" r- n1 h* q16我的页面（下）3 o, R q6 ~' j
文件上传api与后端接口讲解(5分钟), J* H6 m* J/ C) R! r* o/ s* b
token令牌讲解、实现头像上传(23分钟)7 L b- C/ }( a. C3 O
引入图片剪裁实现头像上传(7分钟)0 Y! M8 N* a+ d: @: l
用户修改昵称(18分钟)! L/ A+ X# x$ y5 O3 Q
用户修改生日(17分钟)
) I! @, J% X; m9 T+ Z' I: c 用户修改性别(15分钟)
. j) ]# W3 ?0 R6 P. \17项目发布与上线7 q' a, X, s4 A O5 L4 K5 u
打包H5 web应用(5分钟)7 X- ~4 Y2 U# c% e" q9 F8 k
购买云服务与简介(6分钟)
R. N' X. B. D 配置安全组，重置密码，上传nginx，配置ssh(14分钟)7 L& o" \& N, j0 E" B6 S# t5 p4 ~8 L
安装nginx(9分钟)
' F# @4 }5 S6 W 成功发布H5端web应用(14分钟)
) s0 s* G4 c7 m8 |+ B. Z1 A 微信小程序上传审核流程讲解(8分钟)+ I7 m3 _% o: @' z
打包安卓apk(8分钟)
+ h# `+ T- l, m- x5 s, H 简述ios打包(8分钟)* ?: G/ k) s# E+ m, C6 x
18课程总结( c8 p* c4 o% g6 P% K4 F3 z- q
课程总结与展望(9分钟)
7 U* N; a8 G* Z: k" Q0 _( A
3 n9 B* w5 _9 \( g* _ ) ?/ \; p j j, ~" k2 m$ L: ?- r' t
) R7 N, y* F* M' e) d) A
|
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
