|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。
' u' b1 E0 {" w( E课程目录：
) _7 d R. _/ Z% ?01导学
0 {( a! o' M+ I6 q 导学(12分钟) ) N( X* F, [6 S4 O* s
学前必看！补充课：接口调用参数补充(6分钟)
, q! f d* f% Z4 Q8 J$ \( u 基础框架NextHelloWorld(rar，513.7KB)
0 o5 _& {; ^3 K" R9 g4 L 超英预告最新源码(rar，8.7MB), e% F. v+ M: x$ Y& K0 n
linux工具与ngxin安装(rar，37.3MB)
7 T; l% Y% q. o9 E logo素材制作(rar，730.3KB)7 R7 c6 R1 @# v# p9 M* K& O
02课程介绍 }- J: f: I- j
什么是 uni-app(4分钟)
# c' Q0 @' K6 K% Z) T 为什么要使用 uni-app(8分钟) w$ K5 Z P* R* I8 T
app多端发布效果展示(7分钟)4 \- I i8 G) G q8 A% q# ~, D: a
使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)
+ r) k2 M. Z7 w+ o8 A1 j+ J8 d6 q 微信、支付宝小程序开发工具调试(7分钟)
) T0 D7 }- F' T1 U4 g 在Mac上使用Simulator进行调试(5分钟)
% S0 s1 C o' ]7 m# a03框架基础-上/ f9 w7 A; [5 f& ?$ H4 p) t
简述MVC模式(9分钟)& o+ _7 |/ ]4 ?- ^$ n
图说MVVM模式(5分钟)4 v1 G8 M0 w D+ Z; e( O; F6 n
通过代码阐述MVVM与双向绑定(12分钟)
) N) F% [, a9 r8 U JSON对象和数组的渲染(4分钟)
2 B- E7 I; X" Y, f) u ~+ W 页面路由以及标题配置(11分钟): F6 N" x! v1 @2 [. M
宏观讲解项目配置文件(16分钟)* q, `' `% @5 H& i* @/ T
应用的生命周期(11分钟)
+ z8 c1 R2 ]& W 页面的生命周期(14分钟)
$ T. X& T/ \2 c, z/ z- C# q 固定像素px与响应式像素upx(12分钟)5 @2 H1 X$ ^7 t6 w9 \
在页面里使用{{}}表达式(7分钟)& {3 b" Z& t. r
04框架基础-下# j6 w; U4 a) Q2 _# W* U2 A
v-bind指令对属性的数据绑定(7分钟)1 {+ w/ n7 E. N' u7 s
事件基础(22分钟)
" ?' A# |# M% `/ J 条件渲染 v-if与v-show(7分钟)
0 t& a4 U- J# z% ]& X! h' ~ 条件渲染 三元运算(4分钟). H- ]7 J3 q4 c W4 ?; Q7 d3 ?
列表渲染v-for的使用(13分钟)/ U8 T9 i" U2 N3 o T
指令key实现for循环的组件唯一性(12分钟)
3 |) O! r3 W. E# [$ `, P8 r/ b8 o! E 嵌套循环的下标定义(4分钟)
7 s; ?3 U8 v: {( R# a2 ?% {3 V 条件编译 - 上(10分钟)8 U9 u0 T% d1 O: B$ E* ^# _, r
条件编译 - 下(7分钟)6 j3 ]: c( A# p* S* l- \
05样式与flex布局-上
( P5 K& y* f$ Q flex布局介绍与模型(8分钟)
- i8 S- n3 \, d" _! W flex-direction 元素的排列4种方向(10分钟)' c' R S- f; E3 l" _5 W
导入外部css样式(4分钟)
4 k$ a2 U# ` G$ U9 |6 y. B flex-wrap 元素的换行(12分钟)
6 A: D6 B& X4 d justify-content 元素在主轴的对齐方式(14分钟)+ @/ R8 T* |8 V# T* Q' v
align-items 元素在交叉轴的对齐方式(12分钟)6 }4 k2 V% f, i8 j. W
06样式与flex布局-下/ r1 G5 p1 m S2 a. B% M+ V
align-content 多轴线的对齐方式(13分钟)
. }7 ?7 L& }9 n8 R1 k flex成员项的属性 - order(4分钟)/ o1 S( B+ Z0 y7 D! j# R
flex成员项的属性 - flex-grow(4分钟)
" w4 N# E' T! a1 X8 j flex成员项的属性 - flex-shrink(6分钟)' O B" t# y) P* \; m+ p8 ]
flex成员项的属性 - flex-basis(4分钟)& }4 W6 x( V7 u L5 H
flex成员项的属性 - align-self(6分钟)( X0 A6 x; m' `- R; `" j8 k/ y
07开发首页-上" P: \- M) J i6 F3 @9 q y
创建项目，构建基础页面(8分钟) 免费试学: E, s# L, p) ?9 `% `) z8 p. @1 }
构建tabbar(13分钟) 免费试学4 x. l6 T1 O G+ O( L9 y U
设置全局page，简述view组件(6分钟) 免费试学0 S* w8 U4 B7 j2 e
使用轮播图组件(11分钟) 免费试学
7 L0 O3 o' ~" W 禁用原生导航栏达到页面全屏化(6分钟) 免费试学
+ V% v, e8 H5 i 在线文档的使用(8分钟) 免费试学
+ E6 g1 k4 U- ]" @6 P request网络请求api讲解(5分钟)
+ ]- E% F1 s' W8 C2 r+ J uni.request动态获得轮播图数据(9分钟)2 a, Q" S% B: t. t4 b
箭头函数 this 作用域(4分钟)% _' M! h% v% Y+ I- \+ v
渲染并且展示轮播图(5分钟)
E& t2 T/ H3 h6 n Z/ L5 d% v08开发首页-中
9 B1 G/ `) Q% O, n9 z1 P# G 引入组件实现全局变量(7分钟)/ k2 ~) x+ b+ ~) \/ [8 K5 V# i
使用挂载实现全局变量(4分钟)
( e+ O) L$ Q2 \0 K 在手机端进行微信小程序真机预览(6分钟)
E2 {! {2 P$ }& m5 N6 n8 F" S 微信小程序https使用事项(7分钟), V7 i; c, i# s
开发热门超英 - 标题(9分钟)
7 p' b8 c7 `6 t/ j T | 开发热门超英 - 简述scroll-view(4分钟)" Z7 r# l G) b4 T0 z
开发热门超英-使用scroll-view实现横向滚动(3分钟)2 \6 G9 ?$ x3 J
开发热门超英 - 海报与标题(8分钟)# A( I9 `% t8 j! u" A. }) I S8 o
开发热门超英 - 评分(6分钟)
2 B z3 s6 O I4 t/ m 开发热门超英 - 动态渲染数据(8分钟)' c' B$ \. a( {: o$ |; T6 f6 z6 Z
09开发首页-下
' f3 p' X; P- c" o4 W9 } 开发自定义组件(7分钟)
1 }4 k. r3 A! _; _0 b5 u3 O 父组件向自定义组件传入值(6分钟)( H4 W. |2 c$ Y5 O# p3 S
完成评分自定义组件(22分钟); C; P& }( r6 S/ F# Z( N z, I
视频组件video讲解(9分钟)6 T& w* j& {8 O
获取预告片数据(3分钟)& _ j0 V% ?, Y5 O5 } n9 D
动态渲染预告片(10分钟)
5 _5 T; f: A" l) l( L0 B$ n! u" R 猜你喜欢 - flex布局嵌套编写(18分钟)
/ g7 P4 D( Y2 k, d 猜你喜欢 - 编写点赞css(7分钟)
) ?- \9 {! P$ O3 R1 U9 G 猜你喜欢 - 实现点赞动画效果(14分钟). f* a( k. X, }) \/ M1 E q
猜你喜欢 - 还原动画(5分钟)2 Q! y, U' L) m' ^1 u% c8 ]
10开发首页-终! }/ `, S8 a* c! H. P8 y
猜你喜欢 - 动态渲染列表(6分钟)
; A5 N9 B) x5 O3 ~& O9 P. a0 U 猜你喜欢 - 实现动画数组(7分钟)
& x/ E- Z- M& k3 R8 n" @5 D 猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)% ?+ ]2 r; R. l1 l
猜你喜欢 - 开启下拉刷新(5分钟)
! b F3 @# r& d2 h 猜你喜欢 - loading交互api(8分钟)
! P+ k; _" o( @2 n$ W11构建搜索页-上
- U' s8 K9 S! E+ f! i: f9 K/ p 搜索页面 - 编写搜索栏(19分钟)1 |$ A6 [3 S- |
搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)4 T, A5 N: a+ A
搜索页面 - 动态获取最新预告并且渲染(9分钟) o+ v2 [+ X# F* }6 ?- G9 C+ l8 |
搜索页面 - 分页接口api讲解(4分钟)
$ a& K* i9 L4 |- O9 {/ a+ R; P 搜索页面 - 搜索前置准备(6分钟) F' _- x) E3 X, _" ]
搜索页面 - 执行搜索动态渲染(8分钟)
' ]$ m$ W' `3 _8 S! q4 g4 ^ 搜索页面 - 监听下拉实现分页功能(8分钟)) V* ]1 g4 f% O9 G7 N
页面路由api与传参(13分钟)
4 b. A' Z" W1 u0 p9 l& o 页面跳转组件的使用(7分钟)4 T2 c% [. K# V* |1 c5 J0 D
详情页 - 查询详情与视频渲染(8分钟)) z" M1 L1 j8 {2 @6 z+ Z3 i
12构建搜索页-下
8 \8 Z6 ?. |" S3 }' o 构建预告片基本信息(16分钟)8 {4 p/ l8 g" o7 c/ \
构建评分快与阴影效果(15分钟)- g4 _% \- R. n, V* b
解决错误数据绑定undefined(5分钟)! O$ l X9 d; V9 D8 a7 i7 ~+ \1 h
编写分割线以及剧情介绍(8分钟)
, E3 o. }- ?6 ]9 _+ b+ h5 L 构建剧照与演职人员数据列表(10分钟)7 W- L2 g- N( G
渲染剧照列表(8分钟)& l: `! p% v5 x( I" R
双拼数组构建演职人员列表(12分钟)
) B; v7 ]: N' ~7 l5 Z/ _, P7 e3 X 渐进式导航栏设置(6分钟)
8 b$ ~8 w, [2 V 通过预览api实现剧照预览(7分钟)* ^3 @! }% Q7 i% w4 O- m
演职人员数组拼接预览(8分钟)! r' |" {/ A) ` [* }+ Z
13电影详情页构建5 T% Y1 T) K" D% p( C% o
自定义预览封面图(13分钟)9 L% b) K* y. Q7 F9 `# i4 Y/ J
actionSheet接口api使用(6分钟)
: F+ k6 u' q1 K 下载以及保存图片(15分钟)
7 ~/ Y \) q# R* R0 H 配置https下载合法域名(5分钟)
/ a$ T; [) O y L7 e _6 {, k 实现小程序中的分享转发功能(9分钟)0 F/ v3 I8 z/ Z( o, U2 j" [" \
自定义导航栏按钮(11分钟)
8 _# X3 q% S) S; u4 } 分享到朋友圈(9分钟)* L9 L2 U" Z d% R* h, I
微信开放平台简单介绍(6分钟)$ T. l5 a3 M. \; v% {# {8 G
操作视频对象，提高用户体验(8分钟)
' V0 j3 I! ~7 D7 c9 `. z 优化首页视频体验(13分钟)
. n0 O/ g& f" L t9 r9 T% ?' S: \14我的页面（上）, l6 Z8 c, S# F5 [5 H
开发个人页面-header与导航栏设置(9分钟)
) |$ {. Z7 O. Q: U1 m* B 发个人页面-用户未登录和已登录的页面展示(9分钟)
0 z9 H) y' m% z 构建注册登录页面(8分钟)0 h+ ^4 o- V$ V- s, g
button与form组件讲解(6分钟)
* t) ?% j6 N" W: [ 实现一键注册登录(12分钟)
. `2 m( a+ w7 o# a 通过缓存切换是否登录状态(9分钟)4 s( x# W0 m3 l A0 A7 R; y
构建用户账号页面(9分钟)5 B Q- m. N2 _, o/ A
清理所有缓存api(4分钟). n6 V* M! i- ~2 s
用户登录错误提示与方法挂载(7分钟)* u3 K9 l q# d
渲染用户信息数据(6分钟)
4 o& i# P g6 U M8 x15我的页面（中）" I) _# z& O- s, G" t# N m
用户退出登录(6分钟)% v: f, t' W0 X$ g# _4 ]
第三方登录讲解与页面构建(16分钟)% G/ k9 U5 l* E
第三方登录-小程序端实现微信登录(15分钟)' ?) |+ C; D; l! K
第三方登录-后端登录业务梳理（辅助理解）(10分钟)
/ m6 Y0 e% D9 [ 第三方登录-app端授权登录(8分钟)- X# }& p$ u) x+ K; ~4 c
第三方登录-app端获取用户唯一id及信息(12分钟)
* h& Y$ K# Q6 ^" L9 l4 U! i h% ~ 第三方登录-app端执行一键注册登录(7分钟)+ L# q+ `7 y4 m) _9 ?0 F
查看预览用户头像(7分钟)) `2 p: Q- J% l( |9 s
选择用户头像(11分钟)
, G% L# c6 K. v! k 重新选择头像(3分钟)
+ r1 l0 R& P" |1 M; ^16我的页面（下）
6 Z/ b: q6 y- x. J 文件上传api与后端接口讲解(5分钟)
& {9 v+ v: q! U9 l1 b0 A token令牌讲解、实现头像上传(23分钟)4 I8 Y, a K: Y% m" [& G
引入图片剪裁实现头像上传(7分钟)( J$ T% A- v# Q& T& k6 B
用户修改昵称(18分钟)
1 s$ C0 o$ ^: I5 t) L 用户修改生日(17分钟)7 D, v5 p- z' y' l
用户修改性别(15分钟)
4 T" n, D5 A$ K% |6 ~) b1 L17项目发布与上线. I& L \! j+ x9 p' J3 Z
打包H5 web应用(5分钟)
$ K, L$ `% T: h4 t 购买云服务与简介(6分钟)/ e5 q& v# q- p0 Y% _
配置安全组，重置密码，上传nginx，配置ssh(14分钟)+ e- [, w" Q* ^4 y2 k
安装nginx(9分钟)& q E# b. W- A7 P
成功发布H5端web应用(14分钟)( M" B- f1 M1 P9 d
微信小程序上传审核流程讲解(8分钟) J& N# {: b7 O% O1 R: o
打包安卓apk(8分钟)& Z l. C: |* Q* E( M% u) @
简述ios打包(8分钟)9 L. H0 }- y0 i7 p9 Q( t
18课程总结, L% Z* ~3 O8 y- Q
课程总结与展望(9分钟)6 \! W# U# a2 f/ X( Z
m( t: |) U& b9 z & v; e- S- } R) R
2 ? T8 Y, d" Q7 h( S# c' T" S- s0 O |
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
