|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。 {; `" N, \" _" D( N- t
课程目录：
# F: `! A6 y4 Z W. C1 m: N& H" w5 k) p01导学" H J2 y6 e7 y" z5 I9 X; x: A; C4 S' A
导学(12分钟)
* O: Z. f- q6 s 学前必看！补充课：接口调用参数补充(6分钟)
) S; B# C3 {1 x9 n$ U1 R1 r 基础框架NextHelloWorld(rar，513.7KB)
( ]. z/ Q( [# }& m6 }1 D 超英预告最新源码(rar，8.7MB)6 X ^ W0 _$ v; T9 B6 r0 A
linux工具与ngxin安装(rar，37.3MB)* |. {( m# b1 ]/ g- J5 o: V
logo素材制作(rar，730.3KB)
4 ]/ j$ E. V0 T4 B- c& x02课程介绍
, p3 _3 |' ] ]6 c4 j 什么是 uni-app(4分钟)
* S0 w6 W! m8 H8 z/ f; z 为什么要使用 uni-app(8分钟)
2 X/ U( M1 v& x6 g app多端发布效果展示(7分钟)
! k1 I4 j, v3 S( E3 V1 D+ Y 使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)9 B6 }, V2 b3 M( J( Q7 {
微信、支付宝小程序开发工具调试(7分钟)5 C; s0 c% @( f0 i* y
在Mac上使用Simulator进行调试(5分钟)) g( [" y2 u. P6 h
03框架基础-上) n; m% T A9 C$ i% B' g
简述MVC模式(9分钟)8 b; b/ ?* ^5 v2 m% J& I: ?# U
图说MVVM模式(5分钟)
! V2 | p/ h/ W0 Y `- Y 通过代码阐述MVVM与双向绑定(12分钟). w" ~+ X7 b+ e5 H* O4 p2 _
JSON对象和数组的渲染(4分钟)0 g0 D0 H4 A! }1 e* D8 a7 l) ~
页面路由以及标题配置(11分钟)
8 M$ `" h6 \6 F) ~" X1 D9 c5 D0 w 宏观讲解项目配置文件(16分钟)
' q+ W- H! [7 P- w4 {. |6 R( e. ~ 应用的生命周期(11分钟)
! E; y$ W! ~8 X0 `0 g0 T& R2 t 页面的生命周期(14分钟)
! V6 t& \6 X9 r& P 固定像素px与响应式像素upx(12分钟)
% |& D1 V) o% ?' g. c0 Y8 @% r 在页面里使用{{}}表达式(7分钟)7 d% P( A# r) `2 v0 J
04框架基础-下
8 R+ C' M- s8 { S% T4 U- | v-bind指令对属性的数据绑定(7分钟)1 A# I! k' Q0 i/ I: ^
事件基础(22分钟): o: }+ k3 N' w8 s/ b1 l; f0 U# d
条件渲染 v-if与v-show(7分钟)0 | b$ w, p5 M% w! e9 ~
条件渲染 三元运算(4分钟)8 q1 r' j4 S5 l5 p/ n
列表渲染v-for的使用(13分钟)
) j' O8 L: Q V o 指令key实现for循环的组件唯一性(12分钟)0 t O1 E, J4 t, u0 t" O7 J$ Z
嵌套循环的下标定义(4分钟); H# A" m; K$ Z( ]2 k) ^% |5 y% l
条件编译 - 上(10分钟)8 I0 I8 c5 `; w1 M. d) t/ Q7 S
条件编译 - 下(7分钟)
* R. C" c1 Y$ w/ F$ N% ?05样式与flex布局-上
1 z8 W. i+ O0 f% m flex布局介绍与模型(8分钟)
, \$ V9 Z8 P) @2 M, W* w flex-direction 元素的排列4种方向(10分钟)
3 C2 Y+ Z. m6 `3 o 导入外部css样式(4分钟)$ `. m' D5 W8 o% z) f0 c
flex-wrap 元素的换行(12分钟)
8 y! o3 }& n; @0 n, U, {0 N! p$ E justify-content 元素在主轴的对齐方式(14分钟)1 d+ U) y. e. V
align-items 元素在交叉轴的对齐方式(12分钟)
' F4 p1 W- d/ ~! M) i f) @* U06样式与flex布局-下
$ E) G6 @# }& ^6 I align-content 多轴线的对齐方式(13分钟)! r* o: w0 t5 z" \
flex成员项的属性 - order(4分钟)* p r6 ~1 u% R5 W% X
flex成员项的属性 - flex-grow(4分钟)# h) d7 ^6 h1 f5 f3 d& M( h6 J
flex成员项的属性 - flex-shrink(6分钟)6 \, {7 k ]6 M# X" F
flex成员项的属性 - flex-basis(4分钟)0 x7 r8 ~) G- F3 h) N
flex成员项的属性 - align-self(6分钟)& y6 |" X" _$ Y
07开发首页-上
) n0 K! o7 j5 P7 t 创建项目，构建基础页面(8分钟) 免费试学
) M; x1 _7 [& D# {0 G" a/ J- Y 构建tabbar(13分钟) 免费试学7 d+ o. N, X4 \3 \5 W [
设置全局page，简述view组件(6分钟) 免费试学
* S% [* p' S( M4 M 使用轮播图组件(11分钟) 免费试学. i6 Z% [8 t0 |5 B7 ]
禁用原生导航栏达到页面全屏化(6分钟) 免费试学
7 r& k' i4 p _% v0 {5 a/ a! V+ [ 在线文档的使用(8分钟) 免费试学
' F8 |; u) x' H( T request网络请求api讲解(5分钟)2 Q4 V1 l0 \& W4 d
uni.request动态获得轮播图数据(9分钟)# X. U8 p" }. ]' l6 _3 C9 u0 J( o
箭头函数 this 作用域(4分钟)
6 U' R4 v. a0 }; l C 渲染并且展示轮播图(5分钟)
; w5 u* X. L; i08开发首页-中
" p$ f7 B& M, c5 A1 I1 ~* W1 C. L3 I 引入组件实现全局变量(7分钟): j/ z H' v5 a
使用挂载实现全局变量(4分钟)
C; `' ~' W6 \ 在手机端进行微信小程序真机预览(6分钟). `4 u* K4 U* l+ }, q! I
微信小程序https使用事项(7分钟)! D) e' ?$ F+ K+ i
开发热门超英 - 标题(9分钟)
8 s! y# u2 G6 c9 s# F0 P0 Y! A 开发热门超英 - 简述scroll-view(4分钟)/ u$ s# j7 o4 c; ^
开发热门超英-使用scroll-view实现横向滚动(3分钟)
2 u6 D& Z( r) t% g9 t 开发热门超英 - 海报与标题(8分钟)
^3 V! `3 O \. D3 E 开发热门超英 - 评分(6分钟)
6 {" I/ ~2 R# ] 开发热门超英 - 动态渲染数据(8分钟)
. u0 {* {$ Z3 W% G+ }2 P09开发首页-下
; g) ~* n1 k2 F' j' B! z6 `* k4 a9 I. Q 开发自定义组件(7分钟)% Y# r$ N. j9 C5 \) _
父组件向自定义组件传入值(6分钟)
" i0 y' D& f3 x) t1 h, w( @ 完成评分自定义组件(22分钟)
4 c- H: X2 ~, L- E 视频组件video讲解(9分钟)
5 U( f- X( p* H. a 获取预告片数据(3分钟)" G8 O3 |' j3 D# H4 C" z- O6 ]
动态渲染预告片(10分钟)
1 x+ I0 X% y# n 猜你喜欢 - flex布局嵌套编写(18分钟)
( Y1 J9 {- n7 I3 Q3 E8 H 猜你喜欢 - 编写点赞css(7分钟)0 \% u' M, T. s, _
猜你喜欢 - 实现点赞动画效果(14分钟)- t {7 Y: V* w- `2 d& G- o1 a
猜你喜欢 - 还原动画(5分钟)2 V' m: Z6 `6 Y Z
10开发首页-终2 r5 H/ o/ r+ o* l
猜你喜欢 - 动态渲染列表(6分钟)" O) L1 j) \! d1 b
猜你喜欢 - 实现动画数组(7分钟)
" Q! G) s( r" L 猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)
) D4 t6 l0 N+ |( f' U& i 猜你喜欢 - 开启下拉刷新(5分钟)$ P8 v2 G7 b6 y3 X1 N Y( F
猜你喜欢 - loading交互api(8分钟)
8 F2 s4 K: @- N11构建搜索页-上
& @7 I8 j0 C- P/ X% c 搜索页面 - 编写搜索栏(19分钟)$ Y; p) E/ Y) N1 }
搜索页面 - 编写预告片列表、搜索栏置顶(9分钟): Y2 ]- g4 j0 s& S& x+ G( q# P
搜索页面 - 动态获取最新预告并且渲染(9分钟)( z5 `( f& Z4 o1 q1 ~( Y
搜索页面 - 分页接口api讲解(4分钟)
6 w' U, h) {& t9 k! n# _ 搜索页面 - 搜索前置准备(6分钟)
% U" L6 {+ F5 p3 V1 |% I 搜索页面 - 执行搜索动态渲染(8分钟)) Y4 o) G# I; j& f
搜索页面 - 监听下拉实现分页功能(8分钟)
% B; v( ~& O8 `$ Q 页面路由api与传参(13分钟)' L8 U2 L" F9 c M' s: |5 I
页面跳转组件的使用(7分钟)
( Y# C. _ v# Y) i 详情页 - 查询详情与视频渲染(8分钟)
4 \* E& Z! D; }& C3 {12构建搜索页-下
2 k, L) V. z; d1 A" x2 j, t 构建预告片基本信息(16分钟)0 h5 ^+ Q4 v+ H7 M. G+ E& A
构建评分快与阴影效果(15分钟); h8 y( _5 z/ i6 [6 J, k6 s$ {+ \
解决错误数据绑定undefined(5分钟)
3 ]7 `5 N2 u9 x1 B) N 编写分割线以及剧情介绍(8分钟)
4 k$ ~7 L4 A: D, s: _8 u 构建剧照与演职人员数据列表(10分钟), c- ^7 D6 X$ n" Y4 i4 p& M( a& G& O
渲染剧照列表(8分钟)
/ O9 }2 K' S* S/ D 双拼数组构建演职人员列表(12分钟)
6 C/ K; f* _! t! i* E7 A 渐进式导航栏设置(6分钟)2 @2 D- E! k' z# f
通过预览api实现剧照预览(7分钟)
+ O6 V8 F! h* ] A( H, [ 演职人员数组拼接预览(8分钟)/ B3 X2 z+ z- n& D
13电影详情页构建3 Y. f2 b1 w, E/ n
自定义预览封面图(13分钟)% B$ `0 ]+ h7 _. g8 v1 O
actionSheet接口api使用(6分钟)
! G( R6 [+ L% g. E: h 下载以及保存图片(15分钟)5 `+ k( |% K! p4 y
配置https下载合法域名(5分钟)
/ h [, m3 O; l 实现小程序中的分享转发功能(9分钟)
- O' q, l$ R2 E8 _& _1 j 自定义导航栏按钮(11分钟)& [6 ]5 Q' s9 m, Q6 O3 T
分享到朋友圈(9分钟)
8 d; f( x! C1 _6 C0 y 微信开放平台简单介绍(6分钟): `2 O9 W |5 K2 I
操作视频对象，提高用户体验(8分钟)
. h+ L; X/ X: B/ k4 h& @- M' b; \, T 优化首页视频体验(13分钟)) {" U) j: _% X& R* k
14我的页面（上）
7 }9 P9 I* r9 @4 @3 H4 A 开发个人页面-header与导航栏设置(9分钟)
& N6 K) U \4 l' f 发个人页面-用户未登录和已登录的页面展示(9分钟)
6 q* Y6 Y/ D9 S3 e/ ?. Z 构建注册登录页面(8分钟)
# l5 e+ h8 ^" [( ~# h" C button与form组件讲解(6分钟)2 T2 }1 J- n' M7 @' j* W; y8 g
实现一键注册登录(12分钟)
# @( v7 l j, d' l7 g; } 通过缓存切换是否登录状态(9分钟)
( l; ]% M3 t# [: T0 p& j$ P 构建用户账号页面(9分钟)
- Q5 j6 w, n3 V 清理所有缓存api(4分钟)2 J u2 d; S4 J3 G7 {8 M5 z
用户登录错误提示与方法挂载(7分钟)0 ~6 W- N( F0 s% y. A+ V0 t, K
渲染用户信息数据(6分钟)
0 c+ X. H* d( j' Z- ?0 Y15我的页面（中）/ {4 u: T- R" h" w" A
用户退出登录(6分钟)
8 @: Z9 u6 ^( {. b* \& L 第三方登录讲解与页面构建(16分钟)
- P- q3 x' [/ |( o+ J 第三方登录-小程序端实现微信登录(15分钟)0 A' C8 t& _9 M3 v4 b6 f! T% R. x
第三方登录-后端登录业务梳理（辅助理解）(10分钟)) |, s! E+ q7 r+ Q3 e# a, c8 b
第三方登录-app端授权登录(8分钟)& l* ]& X- s8 Y: o4 k
第三方登录-app端获取用户唯一id及信息(12分钟)
- I1 ?/ g! [/ m% G9 o" v 第三方登录-app端执行一键注册登录(7分钟)
. S) b0 |/ |: q: \, u) V 查看预览用户头像(7分钟)% j1 j4 W5 j6 A
选择用户头像(11分钟), C3 q. j6 _) `6 n$ ]3 v
重新选择头像(3分钟)6 y) r- ~7 A8 s- ?1 S- {
16我的页面（下）
, U; ~3 X+ s$ _: L1 \ 文件上传api与后端接口讲解(5分钟)0 p& {1 u$ o1 D( W: T# p
token令牌讲解、实现头像上传(23分钟): d1 r3 h% f3 ], Y% R. p
引入图片剪裁实现头像上传(7分钟)
3 Y9 R# m8 x6 e# G8 a 用户修改昵称(18分钟)9 V J$ i) ?1 ~$ I9 z8 a* |: q% G
用户修改生日(17分钟): A& d& T" e( f" ^$ O* ~
用户修改性别(15分钟)
- F( v) N" _7 ~( b5 V17项目发布与上线( a4 T8 }9 d- E% F+ T* [0 g2 g9 g) F
打包H5 web应用(5分钟)( p; m& c7 Z8 [$ P
购买云服务与简介(6分钟)% E# Y6 L7 |% B/ o, m: q0 u4 E
配置安全组，重置密码，上传nginx，配置ssh(14分钟)
0 D% g" i5 s. r6 N7 i- D 安装nginx(9分钟)
( ]6 L/ ]- [1 P2 T! j. S5 ^: M2 j 成功发布H5端web应用(14分钟)9 M/ y7 X; Q- @+ x
微信小程序上传审核流程讲解(8分钟)
1 X2 M( M2 [5 F9 v+ k; J: b 打包安卓apk(8分钟)6 d4 `; I9 F4 L3 L9 m# o
简述ios打包(8分钟)( |& d4 U* H2 t
18课程总结
F! l- \6 u( K' O$ D8 A# ?# D 课程总结与展望(9分钟)# W0 l( \8 b3 _" r! N R! ^4 ?
+ z: f1 R0 Y2 g G$ b. Y % t6 L/ X4 n& I' a
6 D' ]8 |8 j! [6 j$ h- B |
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
