|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。2 N; I P! T; r) H. i- n+ @- `
课程目录：
E; l1 z1 Z/ w* r# C01导学0 @3 v0 |" { s# d6 v r; P
导学(12分钟) 6 S7 d; [: c& i
学前必看！补充课：接口调用参数补充(6分钟)
. [5 {: Z6 ^; s5 t 基础框架NextHelloWorld(rar，513.7KB)) ]" U9 p% X: t3 \
超英预告最新源码(rar，8.7MB)4 S9 ~' G# Z, Z" x0 j
linux工具与ngxin安装(rar，37.3MB)
3 W: k" u5 }8 R' |" D1 i logo素材制作(rar，730.3KB)
5 h4 W$ t, j( g' g' K02课程介绍9 p/ Y: u2 h; |+ @0 P: Q
什么是 uni-app(4分钟)
, Z+ Y$ x- K5 c6 L h: K 为什么要使用 uni-app(8分钟)
2 q" |. T. R5 C& z. N app多端发布效果展示(7分钟)
+ ~1 X( O0 h$ [/ d1 F; o 使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)5 Q; B- `) S+ b9 P. a, g9 z
微信、支付宝小程序开发工具调试(7分钟)
# A; v$ i* O% R, H 在Mac上使用Simulator进行调试(5分钟) J: A9 B" N L+ }' _
03框架基础-上/ f) A3 r5 ?( ~ |* c! B
简述MVC模式(9分钟)
6 l* A- |+ K8 G, i9 P* ?* i 图说MVVM模式(5分钟) F, ], B3 r. ?
通过代码阐述MVVM与双向绑定(12分钟)
- h; E) ?, ^+ o. f" t5 [1 w JSON对象和数组的渲染(4分钟)5 A: S$ h$ A% t
页面路由以及标题配置(11分钟)
% U4 G* W% i! H6 x6 b9 o. C 宏观讲解项目配置文件(16分钟); L) u: `' \- x3 j% ~, H( v
应用的生命周期(11分钟)
$ H# R% a1 }" `6 f+ b- O/ L+ { 页面的生命周期(14分钟)
0 A3 p) A" h7 k& [7 \+ X 固定像素px与响应式像素upx(12分钟); S( L, I; [2 i/ @; ~
在页面里使用{{}}表达式(7分钟)& s: j. r* k3 Y2 e( z' D
04框架基础-下
' C* `7 N6 i+ E# y; R v-bind指令对属性的数据绑定(7分钟)
2 ?' Q* b: p4 @1 g2 ^6 Y' K! H0 ] 事件基础(22分钟)/ z3 |$ t! }: P$ I: M2 _& Z) ]7 S% i
条件渲染 v-if与v-show(7分钟)% a( a% J! p( H8 D9 F- F8 V
条件渲染 三元运算(4分钟), k7 G1 e! z. P7 z
列表渲染v-for的使用(13分钟); Y8 r; c3 O( G1 D y8 U* j% u
指令key实现for循环的组件唯一性(12分钟)
& t6 p' Z9 K; ]% _' T 嵌套循环的下标定义(4分钟)
% s6 J0 }0 s* {6 x) S' j: b8 g 条件编译 - 上(10分钟)" o1 N5 S' X$ ?! s
条件编译 - 下(7分钟)/ E0 P, A8 }7 F1 s) j8 I, I
05样式与flex布局-上
" k) m. G. B4 o; |( @ flex布局介绍与模型(8分钟)
- P+ g7 |1 a8 j3 T3 T flex-direction 元素的排列4种方向(10分钟) q- }, i4 N, \. Y4 a- a
导入外部css样式(4分钟)" }9 B8 o8 w9 b! p: u
flex-wrap 元素的换行(12分钟)
3 P, |2 G6 _1 v/ x: T! g justify-content 元素在主轴的对齐方式(14分钟)/ W: x/ |3 `7 o: J% a* f( H2 Y
align-items 元素在交叉轴的对齐方式(12分钟)
" S$ m6 S, c* T+ L06样式与flex布局-下 e5 N1 _) z8 r& J. z+ K0 k7 y( i5 b: D
align-content 多轴线的对齐方式(13分钟)
2 \4 L, M4 g" b5 F) ~# J: O flex成员项的属性 - order(4分钟)
5 x/ E8 w1 Y1 Q2 v& k: t flex成员项的属性 - flex-grow(4分钟)# b7 V4 |# F l" o- V
flex成员项的属性 - flex-shrink(6分钟)
; V, B* T9 m$ ~& W flex成员项的属性 - flex-basis(4分钟): C" a( D T# e0 d7 H* h
flex成员项的属性 - align-self(6分钟)- w: i+ f K7 q" t0 _ M
07开发首页-上
% z# X& z* M9 e, M0 q4 m 创建项目，构建基础页面(8分钟) 免费试学
: f4 H6 u" {" _8 W$ u0 t- K8 m 构建tabbar(13分钟) 免费试学
, }! {7 S' e- v7 F0 I) Z. s3 ^ 设置全局page，简述view组件(6分钟) 免费试学+ C8 q! Q/ L' T! a
使用轮播图组件(11分钟) 免费试学
, r& ~! v" W- |9 O! c 禁用原生导航栏达到页面全屏化(6分钟) 免费试学) Z7 a% ` \1 A8 @8 |" E: M
在线文档的使用(8分钟) 免费试学# k+ q) ^6 }4 _, h: U2 d, r
request网络请求api讲解(5分钟)
. J" I( C4 W) p3 p% z uni.request动态获得轮播图数据(9分钟)
6 T3 G7 \) L. ^6 v Z0 U( m 箭头函数 this 作用域(4分钟)% h. l9 c& r2 |
渲染并且展示轮播图(5分钟)! R$ ^: } T% a$ q8 ?
08开发首页-中6 ?, p7 H9 M" A0 b* M& q" J
引入组件实现全局变量(7分钟)& A- U1 [- w" ]0 y
使用挂载实现全局变量(4分钟)
0 G8 J2 o+ N* `# S/ t# A8 k5 t 在手机端进行微信小程序真机预览(6分钟)
) U8 V$ a, j3 ]! _4 R 微信小程序https使用事项(7分钟)3 m* i2 U! M1 d2 A9 H
开发热门超英 - 标题(9分钟)0 _- B% `- z3 |* |& h W
开发热门超英 - 简述scroll-view(4分钟)' Y) o3 d% d4 K6 }
开发热门超英-使用scroll-view实现横向滚动(3分钟)/ E( W* V# B. i& p& P
开发热门超英 - 海报与标题(8分钟)2 T N; Q4 a* l9 d6 {+ F
开发热门超英 - 评分(6分钟)
* M! K' N/ _* ]2 W+ | _ 开发热门超英 - 动态渲染数据(8分钟). W9 Q% a% H! n5 d1 y4 n
09开发首页-下, T4 X; E% w; g* \" U# b( u: q9 M* f
开发自定义组件(7分钟)
& }, _4 n5 C; o0 Q5 _& I 父组件向自定义组件传入值(6分钟)
0 o9 D3 l8 q) }9 E9 I8 i2 g* ~* w 完成评分自定义组件(22分钟)
0 E, R6 q( s0 s( e+ i" h, K/ _& x 视频组件video讲解(9分钟)
1 o& ]3 @. s' ?8 L7 G 获取预告片数据(3分钟)
/ Y# v% W* Z+ e1 A! x2 {0 I 动态渲染预告片(10分钟)
, [- I, n) w" o6 s 猜你喜欢 - flex布局嵌套编写(18分钟)
! P, J @ t( ]0 Q! g0 p8 i 猜你喜欢 - 编写点赞css(7分钟)" P+ F2 s8 R; o- n( M g3 M
猜你喜欢 - 实现点赞动画效果(14分钟)
2 a' n m$ u b$ z, m 猜你喜欢 - 还原动画(5分钟)- n, ^7 W+ r8 x; M4 U3 R
10开发首页-终
6 h( V4 ~% L6 z4 u1 L" Y2 k; i 猜你喜欢 - 动态渲染列表(6分钟). {# v9 ?. ?/ g, r |3 X: H
猜你喜欢 - 实现动画数组(7分钟)
' k, `! S5 `, k* C3 b9 N P* P 猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)5 [& H P. R' P( z) z) j/ }5 m
猜你喜欢 - 开启下拉刷新(5分钟)9 Y2 n0 Y" [; J! j9 }) @
猜你喜欢 - loading交互api(8分钟)
# G5 u; K$ H2 M3 w2 B; m& s0 I11构建搜索页-上
9 `, t& | ^3 z+ U# y4 F( x+ g* j2 m 搜索页面 - 编写搜索栏(19分钟)3 K! b9 U/ w' b. s; v/ h. G% ]
搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)1 y1 E3 p+ f% A, J0 l& y( V j
搜索页面 - 动态获取最新预告并且渲染(9分钟)8 F, |; _- y9 d* [3 c Q, K
搜索页面 - 分页接口api讲解(4分钟)
' B8 _( |% X4 r+ m) z2 S 搜索页面 - 搜索前置准备(6分钟)- J( I9 }: Z4 `$ Y- r. ?7 {
搜索页面 - 执行搜索动态渲染(8分钟)% C A {- ^1 z; \- g' o& _
搜索页面 - 监听下拉实现分页功能(8分钟)3 Y' f* M6 P$ E
页面路由api与传参(13分钟)
4 x9 F0 q Y: k% j x. F) y 页面跳转组件的使用(7分钟)* R( K3 h1 |$ S1 g
详情页 - 查询详情与视频渲染(8分钟)
8 S1 |" X. j) @' k+ s5 j12构建搜索页-下 H# m/ h/ P! U! p6 ~8 ~& t
构建预告片基本信息(16分钟)
0 E* v. X6 \ _+ {3 B; z ]$ Q 构建评分快与阴影效果(15分钟)% f5 _ F, }" k9 f5 @
解决错误数据绑定undefined(5分钟)
$ E g) S3 n0 E( s0 ^ 编写分割线以及剧情介绍(8分钟)& T J1 b8 B( M V' \
构建剧照与演职人员数据列表(10分钟)' N% ^- ^/ _: W2 C& L! l
渲染剧照列表(8分钟)4 j& P, l! N6 E
双拼数组构建演职人员列表(12分钟)$ \+ H" s, o! G8 V* J
渐进式导航栏设置(6分钟)
" ^4 h. E" A3 @ 通过预览api实现剧照预览(7分钟)
" R& P, h. J1 _6 s: R 演职人员数组拼接预览(8分钟)
' j3 g, j7 k& e4 y p( Z% {13电影详情页构建
6 ]; c6 ^& M I B* z9 Z7 r 自定义预览封面图(13分钟)0 m0 m, n% [& }
actionSheet接口api使用(6分钟)
, Y; n5 X# _, M# A% T2 v 下载以及保存图片(15分钟)
* v2 T- I' K4 l6 t 配置https下载合法域名(5分钟)
! w) d: l# i. M5 l* { 实现小程序中的分享转发功能(9分钟)5 T$ ]* p" ]( e8 H* N
自定义导航栏按钮(11分钟)3 S1 W) {7 q; w9 `
分享到朋友圈(9分钟), ]9 s3 n& c4 ]8 F" ?4 V
微信开放平台简单介绍(6分钟)$ q" i! Z5 h' G" {; u
操作视频对象，提高用户体验(8分钟)# `* _* g6 ?- ?3 O% Q7 G, ?. E) Q
优化首页视频体验(13分钟)6 B( a6 O: R, B
14我的页面（上）( _* [/ ^% ^3 S+ M( k
开发个人页面-header与导航栏设置(9分钟)
! m; L) W7 d) H! p. T L 发个人页面-用户未登录和已登录的页面展示(9分钟)* X1 \' n! f: r* X6 {
构建注册登录页面(8分钟)* l \. J/ U4 L0 F+ v0 a
button与form组件讲解(6分钟)* ]0 \- t) l7 W& Y
实现一键注册登录(12分钟)% z& I1 l2 F$ r- Z2 y
通过缓存切换是否登录状态(9分钟)
: }+ X7 {8 g1 _0 t( @3 Z1 l# E) E. K 构建用户账号页面(9分钟)% Q9 A. d3 o( c8 @8 n7 g
清理所有缓存api(4分钟)! U: R$ m4 z4 J8 M/ s W9 p- ?5 _9 T& Y5 v
用户登录错误提示与方法挂载(7分钟)! W- G. M0 o" l! S. l2 A8 W
渲染用户信息数据(6分钟)
( l. f+ O3 a# `0 G3 S9 R4 j" U+ p15我的页面（中）
+ k/ v* N5 E- M- ~3 E! {7 I! } 用户退出登录(6分钟)
! C: M# N9 L9 _ D( A" I! c% k' U- A 第三方登录讲解与页面构建(16分钟)
5 O3 X u, B3 @- K4 a% H; z# u1 V 第三方登录-小程序端实现微信登录(15分钟); a2 |$ q$ E' M) F5 X. [8 n! p# X2 Y
第三方登录-后端登录业务梳理（辅助理解）(10分钟)- {* q3 H2 N: X6 J, ?* Q* w; t
第三方登录-app端授权登录(8分钟)
% R7 a8 [( Q3 }- C 第三方登录-app端获取用户唯一id及信息(12分钟)
) } T/ @) p8 c8 t! F4 ^* T; ~: A 第三方登录-app端执行一键注册登录(7分钟)
' Q7 l: z* x1 |2 C 查看预览用户头像(7分钟)
% v1 L1 r( Y6 E! S* v+ C6 ]& S 选择用户头像(11分钟)5 z: f9 Y9 l* ~, ?1 r' B- ^; S
重新选择头像(3分钟)' a- G N. X! u: ?3 g5 q* |3 T* T2 h
16我的页面（下）
: d9 u) o) m2 F 文件上传api与后端接口讲解(5分钟)( ?# f' m. Q5 p- S4 H( A" F7 {
token令牌讲解、实现头像上传(23分钟)4 c4 u) _& B: L; n4 i
引入图片剪裁实现头像上传(7分钟)! i1 {' T6 p0 e1 C
用户修改昵称(18分钟)
2 l+ J; G+ o# U 用户修改生日(17分钟)% P6 W3 c% ?, A
用户修改性别(15分钟)
' {& m3 Z3 J' j2 e+ ~17项目发布与上线# C' I% J5 k- t1 {4 Z! F8 X
打包H5 web应用(5分钟)
) {3 L! I2 h5 J% J 购买云服务与简介(6分钟)
1 z1 T. v* k, |" l" p m } 配置安全组，重置密码，上传nginx，配置ssh(14分钟)3 l. D" D) `) C {
安装nginx(9分钟)! X' k k4 S; P- r$ V* i3 E
成功发布H5端web应用(14分钟)8 C* O0 R2 M6 C* E! F2 @; [
微信小程序上传审核流程讲解(8分钟)& P4 e) G) s; E
打包安卓apk(8分钟)
: J n1 n! V7 e 简述ios打包(8分钟)' a1 V1 k" n6 y
18课程总结8 E& _" |) O) H) L
课程总结与展望(9分钟)$ a4 u. \4 o6 w. Q
" w, b* n6 A9 Y" W ; |2 g/ O- Z) W) g
/ z1 a8 X3 }& H' e- x. [' n) ? |
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
