|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。
8 g: r6 n4 Q9 `4 y课程目录：* k1 N5 `2 B5 ^, _* f. o
01导学 |: B- @1 e# i8 G/ l
导学(12分钟) . }1 `; x/ m3 R
学前必看！补充课：接口调用参数补充(6分钟)
; \8 E0 P7 v* g | 基础框架NextHelloWorld(rar，513.7KB)4 [& _: B+ i9 m
超英预告最新源码(rar，8.7MB)7 w/ q- p5 V* |3 U g$ x$ B
linux工具与ngxin安装(rar，37.3MB)( T. V; Z8 C; R* K' [
logo素材制作(rar，730.3KB). U4 q4 t+ q9 [: ^7 E& s+ M$ x$ O
02课程介绍' V" A3 x4 E8 ?% i$ r& S
什么是 uni-app(4分钟)
?0 V0 l5 n0 h# i0 N 为什么要使用 uni-app(8分钟)
/ {" E1 p S# R$ Z u8 A( N app多端发布效果展示(7分钟)* P( N8 i7 \, Q, W2 \ U% C
使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)8 p9 _0 l n* J( t1 E3 I6 u3 s' ^
微信、支付宝小程序开发工具调试(7分钟)
: m( {0 K) r& P3 A 在Mac上使用Simulator进行调试(5分钟)
1 j7 \2 u: I& I. |' b, A03框架基础-上
; y0 G/ Q; N: i# J- @7 n 简述MVC模式(9分钟)0 A4 N U' A& s2 m- |
图说MVVM模式(5分钟)
6 n1 I; ]' }, u. N$ Z 通过代码阐述MVVM与双向绑定(12分钟)* Z# i O/ Z, }" a' Y+ Q% |2 G
JSON对象和数组的渲染(4分钟)7 k* f7 `6 Q% f; ]8 n- U* u4 {4 n. q
页面路由以及标题配置(11分钟)
/ Q$ w/ q, h7 s& y 宏观讲解项目配置文件(16分钟)
; [; }) t2 C+ Q8 f3 s0 s 应用的生命周期(11分钟)
0 m" |8 S; f$ ]3 p/ Y' u 页面的生命周期(14分钟)
. q% T7 J/ W% d3 z8 i8 m 固定像素px与响应式像素upx(12分钟)& |1 p& {; |# U' b$ ^
在页面里使用{{}}表达式(7分钟)6 ]( y( F; k! W: L' O# p3 N
04框架基础-下7 l. \7 r, V- Y4 s* S l. X, t) E5 l/ Y; z
v-bind指令对属性的数据绑定(7分钟): _# y$ R, t# L$ c' A
事件基础(22分钟)
+ [5 T% H- ^/ X! y1 M& ^% K, N3 R 条件渲染 v-if与v-show(7分钟)
) n. e* p: `1 I5 L* ^ 条件渲染 三元运算(4分钟)2 |$ R* D$ E8 }1 M- s
列表渲染v-for的使用(13分钟)
2 @1 f" M$ G5 |! d 指令key实现for循环的组件唯一性(12分钟)
, R- N" `& m, T0 b! X2 c9 _' P3 P 嵌套循环的下标定义(4分钟)
" s3 U4 f4 H7 a( s( j% { 条件编译 - 上(10分钟)
& f* w; T ?) N9 w7 s- H) r 条件编译 - 下(7分钟)$ d8 S6 |' n# C4 u( I, i% Z9 }
05样式与flex布局-上
2 Z9 r) B. W" ?+ `- u! p& o3 h flex布局介绍与模型(8分钟)
. k- Z0 T# B3 x7 k8 b2 U flex-direction 元素的排列4种方向(10分钟)" J' e2 K: s9 d1 e$ o# G" |- D- s
导入外部css样式(4分钟)
- U) W2 G' n4 ]4 t# _( n flex-wrap 元素的换行(12分钟)5 [, Z1 D: J2 p
justify-content 元素在主轴的对齐方式(14分钟), v B" V7 A$ i: J& M
align-items 元素在交叉轴的对齐方式(12分钟)
) r$ }2 P0 m: ], U, k06样式与flex布局-下1 h9 H3 ~1 T) L! L
align-content 多轴线的对齐方式(13分钟); K2 Q, _+ Q& I# o ]1 H
flex成员项的属性 - order(4分钟)
9 ~3 t H! X4 M0 e; W4 b flex成员项的属性 - flex-grow(4分钟)
6 \4 }# e- R5 K, p flex成员项的属性 - flex-shrink(6分钟)
R3 `! X3 O- ?1 f flex成员项的属性 - flex-basis(4分钟)
; j5 s; h1 E& K: n) }" w flex成员项的属性 - align-self(6分钟)
9 f+ s8 E. x9 j; T9 t4 T @07开发首页-上
' K3 P1 V. Y1 G0 @+ b) D; ^ 创建项目，构建基础页面(8分钟) 免费试学
& }: u. z N0 l3 s) I; x1 [ 构建tabbar(13分钟) 免费试学
! h2 D! d c4 P8 G: Z- C 设置全局page，简述view组件(6分钟) 免费试学2 o' s, p# `4 ^! i, n, }
使用轮播图组件(11分钟) 免费试学
* E5 `+ s) M2 Z2 A/ A7 k. v! C 禁用原生导航栏达到页面全屏化(6分钟) 免费试学$ G' s7 C6 r1 v
在线文档的使用(8分钟) 免费试学
, Y. D8 m$ ^2 w$ D5 q7 } request网络请求api讲解(5分钟)# U W V( Y8 X! R, X u8 f9 r
uni.request动态获得轮播图数据(9分钟)4 n' J; d2 o' {& {- R. U
箭头函数 this 作用域(4分钟). j2 Y1 _# K$ o& ]4 ^! X" I0 |" X
渲染并且展示轮播图(5分钟)
! m4 [* \( s" o; y08开发首页-中; X: N$ P% j% I: k
引入组件实现全局变量(7分钟)
) C6 r2 [/ p; \( N$ f6 L8 `; r- Z4 u 使用挂载实现全局变量(4分钟)
8 a1 N+ K: s6 G: A( ^) x+ b: u3 P 在手机端进行微信小程序真机预览(6分钟)! H; a. h8 \0 F% O/ m. T& E1 P" [) t: e
微信小程序https使用事项(7分钟)
4 B7 ?+ L! Y, E- a0 I, G' _ 开发热门超英 - 标题(9分钟)
$ B8 X* m3 f: g9 b( c 开发热门超英 - 简述scroll-view(4分钟)8 P& ~: R. S0 k
开发热门超英-使用scroll-view实现横向滚动(3分钟)
V5 [. \( {$ S* X 开发热门超英 - 海报与标题(8分钟)
5 K, \! H: b5 u0 C6 W 开发热门超英 - 评分(6分钟)
, o' V4 y+ L- B4 D4 i 开发热门超英 - 动态渲染数据(8分钟)9 r: s' m5 E( l5 |! U
09开发首页-下- e, w4 m5 v) J4 `
开发自定义组件(7分钟) Y6 X- S( g3 p% Y1 A3 w( t% E9 j
父组件向自定义组件传入值(6分钟)
: E& O0 P- l1 u4 s 完成评分自定义组件(22分钟)
' n- `% N1 r8 W# |' ` 视频组件video讲解(9分钟)
: w4 y& u' a1 r: f/ @9 ` 获取预告片数据(3分钟) k9 A0 E! u4 N, [; S
动态渲染预告片(10分钟)
7 {2 ^: e y' }8 P. P" j 猜你喜欢 - flex布局嵌套编写(18分钟)( A. {; w) L/ k. c$ n3 W! k
猜你喜欢 - 编写点赞css(7分钟)
4 S! X4 m8 V) ?5 o 猜你喜欢 - 实现点赞动画效果(14分钟)
/ B4 W- C. V( P k) b: o 猜你喜欢 - 还原动画(5分钟)3 T" ^2 L! I+ l6 k7 F
10开发首页-终. I# r" F* o' S6 O3 n& f
猜你喜欢 - 动态渲染列表(6分钟)
8 m6 N3 B. ^3 O0 c) B2 Z8 N) W 猜你喜欢 - 实现动画数组(7分钟)
+ M1 q- y* V" C: j% @1 B& U 猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)
+ D$ L' `' M& t# ]: V 猜你喜欢 - 开启下拉刷新(5分钟) P: c1 z* }- n
猜你喜欢 - loading交互api(8分钟)
' b+ J) @) S: @6 | u+ J11构建搜索页-上5 r7 }' x" {/ f5 J; x* }* y: y' X
搜索页面 - 编写搜索栏(19分钟)
: q* ^; H3 B# Z+ Y6 C 搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)( O. w3 c+ }. S# U$ |
搜索页面 - 动态获取最新预告并且渲染(9分钟)
4 D! n6 J2 W) Z4 k# w- I1 J! Q: ^ 搜索页面 - 分页接口api讲解(4分钟)
( ^% o1 E* H5 N1 t$ ?& E k0 o$ Q 搜索页面 - 搜索前置准备(6分钟)
0 _2 d; a: O2 }2 \ 搜索页面 - 执行搜索动态渲染(8分钟)
% K8 z# S7 i7 d) X& T5 V 搜索页面 - 监听下拉实现分页功能(8分钟)
V% l( l% `, h: t 页面路由api与传参(13分钟)
& \5 ~2 }! n8 A/ g- P, w3 ^; H 页面跳转组件的使用(7分钟)1 B$ _( h* @7 U& u
详情页 - 查询详情与视频渲染(8分钟)
3 Z3 y- G1 K# `4 s12构建搜索页-下2 q4 n4 I. r! m `8 z; L$ z* W
构建预告片基本信息(16分钟)% x) {, m% V% ~, c0 x' x# ` j( ?
构建评分快与阴影效果(15分钟)/ |6 d/ T# V' U8 J2 X
解决错误数据绑定undefined(5分钟)
- T( J2 b$ D$ g; E/ q, y$ l4 `5 E 编写分割线以及剧情介绍(8分钟)
" o. `8 j/ R6 I& S) W- R6 ^! W6 Q/ u 构建剧照与演职人员数据列表(10分钟)# c4 _# h7 V+ X, w. a
渲染剧照列表(8分钟)
- Y6 S! w. Z; [4 a* V+ | 双拼数组构建演职人员列表(12分钟); F* K4 A9 U5 V
渐进式导航栏设置(6分钟)
2 J2 i, j3 |/ x# U( u9 ` 通过预览api实现剧照预览(7分钟)" i1 X# x" H# m2 b7 g
演职人员数组拼接预览(8分钟)
/ V1 b `$ P: }13电影详情页构建( P# {$ v3 L: G9 d2 R* d
自定义预览封面图(13分钟)
& J4 k$ A+ ], u' p: J9 a actionSheet接口api使用(6分钟)- ?% d% z, M) e! i# ]
下载以及保存图片(15分钟)1 l+ |0 z6 j4 ?' v
配置https下载合法域名(5分钟)$ u& X& L/ @7 P @6 D [
实现小程序中的分享转发功能(9分钟)* V! A1 W( Y4 Q- B/ x9 J
自定义导航栏按钮(11分钟)
( R: x$ h- B5 ^: u$ ~5 J, d! F 分享到朋友圈(9分钟)+ n/ {1 w! E1 _9 X, G5 A
微信开放平台简单介绍(6分钟)
`* _: F0 I# i" O: U$ I1 x; I 操作视频对象，提高用户体验(8分钟)
, c# O+ ]" F) U4 W 优化首页视频体验(13分钟)6 u6 N1 i. w7 G0 d- m' E" D/ `
14我的页面（上）
2 v# G. d; G; G& o 开发个人页面-header与导航栏设置(9分钟)
$ `& U$ s: p- u0 _ 发个人页面-用户未登录和已登录的页面展示(9分钟)! M' @9 o- a8 d+ p: T% |6 n
构建注册登录页面(8分钟)
1 \8 M# g+ U# `( K button与form组件讲解(6分钟)7 S$ c! F) g0 {2 ~' l" d% n
实现一键注册登录(12分钟)
( x; [ |$ D6 s6 w) m6 s 通过缓存切换是否登录状态(9分钟)
. V; r j. I$ F4 ] 构建用户账号页面(9分钟)3 }0 y1 i" C2 i4 @- F% ?5 S
清理所有缓存api(4分钟)
0 ^; y$ X& j0 W3 W0 \ 用户登录错误提示与方法挂载(7分钟)- j f$ I" ]% b, |1 R
渲染用户信息数据(6分钟)1 G3 f+ ^ E- W: I
15我的页面（中）
+ J) L$ R; y% Q/ I0 v 用户退出登录(6分钟)
8 a+ ?+ x3 U: }1 K 第三方登录讲解与页面构建(16分钟)
8 w( J. E: S+ Y3 G 第三方登录-小程序端实现微信登录(15分钟)
( x3 G& b- W; B 第三方登录-后端登录业务梳理（辅助理解）(10分钟)
) R4 a9 Z" I$ T 第三方登录-app端授权登录(8分钟)" l$ r& K( ^' s, n, q) c" E0 u! s
第三方登录-app端获取用户唯一id及信息(12分钟)( _- ]5 i2 k/ S% I
第三方登录-app端执行一键注册登录(7分钟)
2 f! h7 c4 \- M& j6 {2 n 查看预览用户头像(7分钟)
7 \' [* @/ X ^. k: S; B- ] 选择用户头像(11分钟)+ z$ p2 t( u" i- g4 G9 o9 r
重新选择头像(3分钟)4 g( }& e- r; n
16我的页面（下）5 E/ p8 q8 i3 w; \( r
文件上传api与后端接口讲解(5分钟)' ^2 X% p. P' F+ k' g
token令牌讲解、实现头像上传(23分钟)7 X; H3 i# L. T
引入图片剪裁实现头像上传(7分钟)
4 s( b+ |! t$ r5 a o9 `( Z 用户修改昵称(18分钟)
- W5 J! ` M* Y6 D9 Q0 Q8 P 用户修改生日(17分钟)
& @' j* S0 S! m 用户修改性别(15分钟)
- w5 g) @; W' z8 W d17项目发布与上线. v0 f* J9 }" q
打包H5 web应用(5分钟)) a& g- Q) R7 k
购买云服务与简介(6分钟)9 m8 F( z" {1 R/ O3 ]+ D, Z6 ^
配置安全组，重置密码，上传nginx，配置ssh(14分钟)
) S* g9 ]& D3 b 安装nginx(9分钟)
: h, ^/ e" J' c: R! ^( R( h. ] 成功发布H5端web应用(14分钟)
% w& ~. X4 }0 s" `. v 微信小程序上传审核流程讲解(8分钟)( |& F) n8 a* u# {
打包安卓apk(8分钟)4 o9 H1 s9 R* O n% \
简述ios打包(8分钟)
1 g6 G1 u+ \$ V* f18课程总结9 P3 r Y, x+ \4 h) Q. i" H
课程总结与展望(9分钟)# k, Z! f8 w/ F$ O; y- M: N) j/ W
G- D" R) [1 Y6 c
9 E, r; ^2 L) B5 Z& h
" R( x0 Z5 @) ]! X8 k
|
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
