|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。
8 W' z2 x. y+ k5 c3 p" z/ ]课程目录：
/ V( H9 X7 f. K6 n3 o01导学+ _. b g# |, H0 Z8 U' y3 _( @( s
导学(12分钟)
7 F$ C/ j+ B6 j1 q n 学前必看！补充课：接口调用参数补充(6分钟); `6 R& G% h7 e# e7 N
基础框架NextHelloWorld(rar，513.7KB)" x/ W9 F- ^- E" V) x5 y' G
超英预告最新源码(rar，8.7MB)- r* }) K+ k! P
linux工具与ngxin安装(rar，37.3MB)( z5 t) h( N) r! w, n4 X
logo素材制作(rar，730.3KB)' K# W# y4 s( Y! B/ f1 d1 B
02课程介绍9 P' ~* V4 ?6 B; P5 O. e7 [
什么是 uni-app(4分钟)/ l# E2 f- O4 y( f
为什么要使用 uni-app(8分钟)
& A9 M( V2 [# F3 R- G! D app多端发布效果展示(7分钟)
. w& u, F4 |7 p6 d0 i3 c 使用HbuilderX在ios、安卓、H5进行真机调试(14分钟); g1 F+ J e& X) C& f( \& e5 x
微信、支付宝小程序开发工具调试(7分钟)
4 ~3 z7 |$ y% m2 R1 R' L+ i 在Mac上使用Simulator进行调试(5分钟)
/ f7 D6 M% z; E: p; I& \8 m03框架基础-上4 D1 c( L: R* p2 V+ R X4 v6 w! M- K; l
简述MVC模式(9分钟)
6 F5 [0 W# V# Y* e" F6 ?# l 图说MVVM模式(5分钟). P7 T6 y! \' N/ O3 H$ p3 s( n7 x
通过代码阐述MVVM与双向绑定(12分钟)
! Q o3 F# _1 H+ U7 f8 j; h( L7 J JSON对象和数组的渲染(4分钟)
/ f- C: [ B. |: `7 k 页面路由以及标题配置(11分钟)
; @& [( t- X. |! _5 k: s 宏观讲解项目配置文件(16分钟)$ O- F4 I5 M+ V2 D4 `
应用的生命周期(11分钟)
, J8 z: H5 I$ Z+ A2 {+ I 页面的生命周期(14分钟)
$ a% x8 F; z! L' w+ B/ \ 固定像素px与响应式像素upx(12分钟)# d- {+ y5 [+ X2 l/ i6 p# N+ m
在页面里使用{{}}表达式(7分钟)
# M9 J# j! m# O$ F$ ~& h( o1 T04框架基础-下
. r! }+ t( j+ F& \5 Y# R v-bind指令对属性的数据绑定(7分钟)0 Q7 I$ t: c6 r+ ^: X8 A; A
事件基础(22分钟)
. `5 G! S8 B$ t" i5 c 条件渲染 v-if与v-show(7分钟)3 J8 w; j$ Y& X
条件渲染 三元运算(4分钟)
% a, V$ K0 Y9 v 列表渲染v-for的使用(13分钟)
, o5 T! j0 n8 ]9 t+ A 指令key实现for循环的组件唯一性(12分钟)
& q( Q) a$ L; E2 J+ ]; C; ~1 @ 嵌套循环的下标定义(4分钟). J5 H8 w1 M1 a; q' m3 d, L
条件编译 - 上(10分钟); h: J8 J" C" f8 D& B6 R6 l7 m
条件编译 - 下(7分钟)0 n; D9 N$ c6 r5 e/ l3 u
05样式与flex布局-上
: i% T1 I% C& i flex布局介绍与模型(8分钟)" \1 w9 g* D; B
flex-direction 元素的排列4种方向(10分钟)
& D8 @, ?' l- H8 K7 L 导入外部css样式(4分钟)
5 P9 T) I* E0 k& B flex-wrap 元素的换行(12分钟)5 {0 M9 W1 f0 a( c
justify-content 元素在主轴的对齐方式(14分钟)
( T% h1 a8 M$ @! O+ l, n$ D% H" E align-items 元素在交叉轴的对齐方式(12分钟), U& o: U4 d) F4 j
06样式与flex布局-下5 b3 u4 i' Y! K+ W; x
align-content 多轴线的对齐方式(13分钟), o. E, l0 }9 B" {6 z7 I
flex成员项的属性 - order(4分钟)& d; s7 M, q1 \1 {. @
flex成员项的属性 - flex-grow(4分钟)
& O# a' ?3 o1 a5 S& f: z2 t flex成员项的属性 - flex-shrink(6分钟)# b& B6 T1 Z2 d9 Z" @4 y) B
flex成员项的属性 - flex-basis(4分钟)
2 L, p( P) Z) G/ D( t flex成员项的属性 - align-self(6分钟)
) y5 ~0 E" }4 W07开发首页-上* S, P3 J0 y* Y
创建项目，构建基础页面(8分钟) 免费试学
& N1 F5 G5 l$ m2 Z% a; f* o9 }5 F- [ 构建tabbar(13分钟) 免费试学
, }, q6 |3 x0 q 设置全局page，简述view组件(6分钟) 免费试学
9 w. G% {! u5 s0 x; w* A 使用轮播图组件(11分钟) 免费试学; D, A* I0 r, S/ u d- G( n" C" F
禁用原生导航栏达到页面全屏化(6分钟) 免费试学
0 N" e" E0 s- G 在线文档的使用(8分钟) 免费试学
* q* j' k; s; K! n6 ^" F request网络请求api讲解(5分钟)
2 s h7 Y7 [1 Q2 d& G# s uni.request动态获得轮播图数据(9分钟)4 `/ N! l- Y( O& A1 A
箭头函数 this 作用域(4分钟)
( u# `& g) [4 b* V" P9 I1 X 渲染并且展示轮播图(5分钟)! N u8 h+ S4 W2 N$ n. ?
08开发首页-中: _, I% d ~" w& N6 S
引入组件实现全局变量(7分钟)( H# F3 s9 o# o4 ~' N% L7 I
使用挂载实现全局变量(4分钟)! x- L% h5 {) H) i0 X
在手机端进行微信小程序真机预览(6分钟)
! q4 a" @1 W9 r: X 微信小程序https使用事项(7分钟)+ M# c7 Y; ^& J
开发热门超英 - 标题(9分钟)0 g! m7 }, x4 X" I8 |7 J
开发热门超英 - 简述scroll-view(4分钟)* D3 Z `0 j+ |/ N4 U* K
开发热门超英-使用scroll-view实现横向滚动(3分钟)& ]- r3 E* C! N
开发热门超英 - 海报与标题(8分钟)( U# k2 T7 X8 {
开发热门超英 - 评分(6分钟); e u, A% e2 @8 s/ u
开发热门超英 - 动态渲染数据(8分钟)8 u" S' l* E- L/ p% x: }. f9 w
09开发首页-下
! J7 ]% ?3 \/ ?4 E* X- \ W 开发自定义组件(7分钟)
- {6 ^5 `, o1 l' z! [6 X 父组件向自定义组件传入值(6分钟)& k9 `6 H8 ^7 q8 w, | {' @7 c% B6 B
完成评分自定义组件(22分钟)6 }! h/ y0 b0 O5 h
视频组件video讲解(9分钟)
9 Z6 I( O, J' \# M 获取预告片数据(3分钟)+ v, j$ v$ j6 h
动态渲染预告片(10分钟)3 E$ H* X; {+ q/ M
猜你喜欢 - flex布局嵌套编写(18分钟)& n9 ^6 j- j( H- | P1 J' I
猜你喜欢 - 编写点赞css(7分钟)
- ^0 B% K; [( z! a 猜你喜欢 - 实现点赞动画效果(14分钟)
# h# V2 f1 \+ F7 M 猜你喜欢 - 还原动画(5分钟)
: y1 c2 i- E: ^; t, y5 v1 `10开发首页-终/ r/ R* S" P* @
猜你喜欢 - 动态渲染列表(6分钟)
p8 x) j# o; ]+ ?3 g 猜你喜欢 - 实现动画数组(7分钟)- L) s$ K. W% K* D* T
猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟). S2 V4 B p( x" P6 a! [& U
猜你喜欢 - 开启下拉刷新(5分钟)- k1 l+ j4 ?/ z3 q4 r4 b5 @: p
猜你喜欢 - loading交互api(8分钟)& o- L, G6 \6 f0 ~* h ?
11构建搜索页-上
, F7 v. }0 e8 N$ O) H 搜索页面 - 编写搜索栏(19分钟)& Z p+ | ^& v% ?
搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)) y" q) ~2 |# b
搜索页面 - 动态获取最新预告并且渲染(9分钟)5 s1 x. n. D/ w- ^+ Y0 j7 V
搜索页面 - 分页接口api讲解(4分钟)7 b. @# J; C$ [) Q/ E3 m! c
搜索页面 - 搜索前置准备(6分钟)
2 U2 B, @. d' B5 ~! \$ ]" J 搜索页面 - 执行搜索动态渲染(8分钟)
- W4 V n4 Z+ x! [( h 搜索页面 - 监听下拉实现分页功能(8分钟), [& v0 [8 H0 k1 B$ f2 R
页面路由api与传参(13分钟). ]6 d; T d0 t9 H E* y* _% q6 b. z
页面跳转组件的使用(7分钟)
9 G! K! r2 d% B Z, C( O 详情页 - 查询详情与视频渲染(8分钟)% A/ r. E8 C9 D3 @5 r
12构建搜索页-下2 z1 `- x; v8 y1 M8 `. T
构建预告片基本信息(16分钟)
! i% N2 l7 R) X" V+ t# p 构建评分快与阴影效果(15分钟)
8 C- V7 h9 T1 o; [ 解决错误数据绑定undefined(5分钟)
! S8 ~# f1 ^ C+ J; M 编写分割线以及剧情介绍(8分钟)5 k- X# v5 u) Y7 a$ x0 b! o
构建剧照与演职人员数据列表(10分钟)
% F" @; o, k$ H0 Z 渲染剧照列表(8分钟)! [' Z- o' }7 S8 l: ]
双拼数组构建演职人员列表(12分钟)+ V- J/ H) D9 C9 |) z9 M/ ]
渐进式导航栏设置(6分钟)
7 L2 b* M8 |/ U# j! B, L, Y" U) H( i 通过预览api实现剧照预览(7分钟)2 ^ q& `4 ]5 O$ g5 {2 U/ N
演职人员数组拼接预览(8分钟)
2 y% c, M/ s2 |% w8 ?* {; A2 P6 [13电影详情页构建7 B; c( S8 W- S6 u# C0 G
自定义预览封面图(13分钟)5 G5 f1 F/ `" \: k6 k* f
actionSheet接口api使用(6分钟)- R6 |- w! k8 n9 b
下载以及保存图片(15分钟)' \+ ]3 s* m7 D* t% M0 L5 Z+ e! J( y
配置https下载合法域名(5分钟)
2 H/ X; W5 x) f3 [; y# z/ L 实现小程序中的分享转发功能(9分钟)
# V* T6 U; D/ d b2 w, b! T7 x 自定义导航栏按钮(11分钟)( J! a3 W; Q( P
分享到朋友圈(9分钟)
' k+ s* o& b" q7 e& o 微信开放平台简单介绍(6分钟)/ g$ g0 `; q% r3 N- A
操作视频对象，提高用户体验(8分钟)
* Q& ]) o- I% d 优化首页视频体验(13分钟)
3 ^1 f) X, b" C* y14我的页面（上）
4 Z2 L2 J5 i' H: C# ~7 i6 i4 W! f 开发个人页面-header与导航栏设置(9分钟)
" j' j' u _! h U% B& C: }( }* I 发个人页面-用户未登录和已登录的页面展示(9分钟)8 y* H$ ^4 _$ Z0 M E) h% P
构建注册登录页面(8分钟)
$ z) q' F+ ]% N, B button与form组件讲解(6分钟)1 ^$ d& S7 k1 x( v
实现一键注册登录(12分钟)
4 @: { \$ q- C( o5 Y 通过缓存切换是否登录状态(9分钟)
3 M; S& z. w3 V5 w6 `0 R 构建用户账号页面(9分钟)
* h+ C! X5 _" }! d* y 清理所有缓存api(4分钟)' t: A% D3 h/ ?$ O7 _
用户登录错误提示与方法挂载(7分钟) F* P z5 f4 _! D) q- @# _
渲染用户信息数据(6分钟)
& F |" C$ r& _( t- t: k15我的页面（中）+ l( h# T( n, R' j
用户退出登录(6分钟)8 u8 {3 f% [) c
第三方登录讲解与页面构建(16分钟)
4 X0 u: n$ g! P5 S; N' T7 P 第三方登录-小程序端实现微信登录(15分钟)
. b5 {+ G V% @7 a2 V 第三方登录-后端登录业务梳理（辅助理解）(10分钟)
2 F$ C: l% s5 U0 P 第三方登录-app端授权登录(8分钟)
8 b. F' h8 O+ q, W 第三方登录-app端获取用户唯一id及信息(12分钟)+ Z2 s1 S5 ?' q. W8 c! n' y R
第三方登录-app端执行一键注册登录(7分钟)+ N0 b# a8 W- i* X! l. V- N4 ~& D
查看预览用户头像(7分钟)
- U0 A4 Q9 n9 ^7 G 选择用户头像(11分钟)2 @: i/ _; e4 E7 L
重新选择头像(3分钟)' x: a% A3 F9 X/ w1 n
16我的页面（下）
9 H7 W& s9 t( W0 y0 X* z9 G) Q: b& R 文件上传api与后端接口讲解(5分钟)1 [* x7 g6 Y) L0 |. ~+ Q( o
token令牌讲解、实现头像上传(23分钟): F! N3 m# R, G: T- U" i% G3 q+ `
引入图片剪裁实现头像上传(7分钟)# _5 k. M4 U4 t l$ |, ^, M
用户修改昵称(18分钟)
/ t/ o" `6 B: | 用户修改生日(17分钟)4 o& B- f# t/ l9 ?5 ^
用户修改性别(15分钟)
& K' q) `0 M; b I* P& T/ }17项目发布与上线% x9 n8 B! K1 b* V* [8 r& b9 V
打包H5 web应用(5分钟)" H; P0 F+ S( f( J! W. }) e
购买云服务与简介(6分钟); z: ]# \; N, O. ]/ T
配置安全组，重置密码，上传nginx，配置ssh(14分钟)
- U0 i+ d& u! b/ Y9 v; d6 | 安装nginx(9分钟)
' z3 `- k7 ?- K( z$ V( N 成功发布H5端web应用(14分钟)
8 ]% ]3 R' Y; ^) Y& O W$ h+ w 微信小程序上传审核流程讲解(8分钟)
9 A0 P$ S" J% j! P# X 打包安卓apk(8分钟)
" l% S2 N6 B6 o! J, E 简述ios打包(8分钟)
# J: s8 z6 D4 @5 C* b, L18课程总结
0 B3 r5 [; C$ i( d% ~ U 课程总结与展望(9分钟)* l% O; A* q! k" Z+ H0 W1 N
) ~, I* V, f* \& W
% X5 e4 a R) H, H/ O5 Z
; u+ [4 P- N% b# Z0 M. @' t( ? |
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
