|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。
_7 |8 C; s7 Y6 G课程目录：6 U- K$ K, e' b% U8 B9 t8 i5 g8 G& [: ~
01导学* u5 F. N$ d8 r2 F9 S/ R1 a
导学(12分钟)
8 t1 d: p3 b- C0 V+ J 学前必看！补充课：接口调用参数补充(6分钟)3 o( S& J# d% k9 B! E9 T" z
基础框架NextHelloWorld(rar，513.7KB)
/ l) i5 G$ Y6 ^( _ 超英预告最新源码(rar，8.7MB)
4 {3 S9 q3 \1 a) Q linux工具与ngxin安装(rar，37.3MB)7 o5 v% [7 u' f% r3 g5 t4 y- X
logo素材制作(rar，730.3KB)+ ^# {$ ~4 d/ _3 m0 Y3 o9 Z
02课程介绍8 B0 ^- f1 \0 L1 S' P/ b
什么是 uni-app(4分钟): D% ?; n& x/ O" h# W" G2 W
为什么要使用 uni-app(8分钟)* u2 g/ z! c6 N4 w# Q3 |6 ~# q6 C
app多端发布效果展示(7分钟)8 a& z7 l; B' m5 Q" G; o( O- i
使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)
; `* i& E' g2 b5 s. ^; y 微信、支付宝小程序开发工具调试(7分钟)1 B" V6 [3 S* _, V- F, J. P/ ]
在Mac上使用Simulator进行调试(5分钟)
/ C: ~ c8 z5 c" G: i' n; d03框架基础-上# O; T$ r) S: e
简述MVC模式(9分钟)$ f5 T4 C+ C4 ?+ z! V% \5 b
图说MVVM模式(5分钟)
3 @. F2 F5 s+ y2 n+ |) I& D 通过代码阐述MVVM与双向绑定(12分钟)' N( {: Z% m6 H. ^
JSON对象和数组的渲染(4分钟)
# I$ b2 b& n1 L! w 页面路由以及标题配置(11分钟)8 D2 W( j2 L! T$ D# C% K% I+ T
宏观讲解项目配置文件(16分钟)
5 C- W& b8 q# t# r( Y 应用的生命周期(11分钟)# @" @! E7 R6 w6 Z. v& D4 \6 I5 D
页面的生命周期(14分钟)
7 u. K& C5 e$ [ v# n 固定像素px与响应式像素upx(12分钟)
8 f1 ~* i% o! o, _3 ~ 在页面里使用{{}}表达式(7分钟)* c( y1 u6 f% U$ S4 u9 O! I/ w9 O0 _
04框架基础-下
' i! i. T, [1 ~) z2 w* d v-bind指令对属性的数据绑定(7分钟)
1 \2 G c6 Z" U g6 l% z# c 事件基础(22分钟)- s# H% G% |, Q! t) |) D1 u, ^
条件渲染 v-if与v-show(7分钟)4 W. X2 n3 ?% J" B4 H V
条件渲染 三元运算(4分钟)
- j3 k0 r" O+ m 列表渲染v-for的使用(13分钟)( e3 B O# V, u, L/ u! r2 g
指令key实现for循环的组件唯一性(12分钟)3 a0 N4 S% e# f
嵌套循环的下标定义(4分钟)
3 X- L, d* o$ C) D% C* W 条件编译 - 上(10分钟)- z4 D( S1 s. d! J) \- P3 s
条件编译 - 下(7分钟)4 v e6 q5 i: _: t
05样式与flex布局-上7 e' G) a$ M9 E l
flex布局介绍与模型(8分钟)6 }7 v- X" i L: x; y+ m" K
flex-direction 元素的排列4种方向(10分钟)
) c3 C3 o1 K6 ]. S" W4 G 导入外部css样式(4分钟)' |4 t% v4 b6 ?) ^% M% P
flex-wrap 元素的换行(12分钟)
) P1 y5 P' S/ V4 P justify-content 元素在主轴的对齐方式(14分钟)
; D" i- X X4 Q align-items 元素在交叉轴的对齐方式(12分钟). F2 d% p% P6 `) y
06样式与flex布局-下
. Y2 e" N- d1 O- Z: @2 L align-content 多轴线的对齐方式(13分钟)
4 q' ?& s" S, ^5 d flex成员项的属性 - order(4分钟)
1 i1 f( |/ Y- e flex成员项的属性 - flex-grow(4分钟)
0 k/ h' L3 u5 l$ n flex成员项的属性 - flex-shrink(6分钟)* E8 `" e! s( x+ \6 B3 l/ Z# Q
flex成员项的属性 - flex-basis(4分钟)
4 m8 r) R5 N1 M0 ? U% } flex成员项的属性 - align-self(6分钟)8 Q) T: z" c# S# S9 N9 y X. Y
07开发首页-上* \# @* E! B$ t2 g) F
创建项目，构建基础页面(8分钟) 免费试学* {# O7 ]' F2 z# b0 B1 w
构建tabbar(13分钟) 免费试学
2 R2 V$ T3 A2 I1 d& e/ ^ 设置全局page，简述view组件(6分钟) 免费试学
* @. T( z! V7 [, R2 H 使用轮播图组件(11分钟) 免费试学
" g6 a/ j% E1 j 禁用原生导航栏达到页面全屏化(6分钟) 免费试学- l' v* N, b' y* n" q* a9 l2 O5 A& Z
在线文档的使用(8分钟) 免费试学
& d9 m Z- C1 g: W2 [' I! C( K! ~ request网络请求api讲解(5分钟)
& {+ Y, Q& i! j1 W- X uni.request动态获得轮播图数据(9分钟)
' S0 ]5 |: m8 O X: I. V7 K4 w- S/ q 箭头函数 this 作用域(4分钟): ?/ i2 w& `6 o
渲染并且展示轮播图(5分钟)
) y# _6 z2 ~) R) T08开发首页-中
# X* l: x7 K+ \8 b, H) o 引入组件实现全局变量(7分钟)
E) W3 F5 o# Z$ P. m$ @. L 使用挂载实现全局变量(4分钟)( b; g- Z3 d4 G5 h* f
在手机端进行微信小程序真机预览(6分钟)# q5 _( A+ i9 n# R- d k1 X
微信小程序https使用事项(7分钟): X" R' `9 \/ ]2 T5 x
开发热门超英 - 标题(9分钟)+ p) L+ m9 e( J& `( P* L
开发热门超英 - 简述scroll-view(4分钟)
0 W7 f: k6 n1 P- t q# j8 e( f7 G& w 开发热门超英-使用scroll-view实现横向滚动(3分钟)) n/ i3 S2 w0 F4 @1 E( b, u/ x
开发热门超英 - 海报与标题(8分钟)' V7 a. q6 m5 q
开发热门超英 - 评分(6分钟)
) v/ w7 w9 E" C& X5 f P 开发热门超英 - 动态渲染数据(8分钟)6 j7 L! l6 j$ K( y% j `! k( ]
09开发首页-下
% g! Q8 H# X5 ]; H E( x6 t( q 开发自定义组件(7分钟)
* J3 I2 ]4 P1 V- r# X 父组件向自定义组件传入值(6分钟)6 y. c0 s w9 L
完成评分自定义组件(22分钟)
. D6 ~7 |% M$ g* Q! I9 U6 T3 N 视频组件video讲解(9分钟)- @$ Z% ~8 \* C: @0 `
获取预告片数据(3分钟)" h, r6 A" u: a5 U X
动态渲染预告片(10分钟)
; P, N" L9 T4 i' b8 ]$ j4 H0 ~; m 猜你喜欢 - flex布局嵌套编写(18分钟)! t, n% V0 P% ^7 u
猜你喜欢 - 编写点赞css(7分钟)
6 T# I( L# Q0 j3 y: b5 q5 q 猜你喜欢 - 实现点赞动画效果(14分钟)
9 r+ |4 R' H" K7 F9 E: J8 | 猜你喜欢 - 还原动画(5分钟)( f4 f: b1 _7 B' c
10开发首页-终! O& i# y% O' Q* S$ y0 A/ Q' i
猜你喜欢 - 动态渲染列表(6分钟)
1 t' v, f {0 v6 u$ J" E# C4 R. K+ i 猜你喜欢 - 实现动画数组(7分钟)
# h4 q# f1 h( O$ e8 z1 c! X4 W 猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)
+ v: c0 _! N! L- O7 ~4 i4 S 猜你喜欢 - 开启下拉刷新(5分钟)- c$ A- @, i0 @) e# @
猜你喜欢 - loading交互api(8分钟)
: r/ c/ T# J5 M3 o. p# y4 b11构建搜索页-上
+ N. g+ Q% M; ^, V 搜索页面 - 编写搜索栏(19分钟)
6 m/ \* r, @$ k$ ?7 f7 m 搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)- @3 Z3 j# i6 h5 @
搜索页面 - 动态获取最新预告并且渲染(9分钟)
1 p: K8 y0 j6 m 搜索页面 - 分页接口api讲解(4分钟)# F% j u' P; H/ N4 ]3 v
搜索页面 - 搜索前置准备(6分钟), Q+ U$ e- m j! H8 r! k
搜索页面 - 执行搜索动态渲染(8分钟): J* d) O. ?, b" \! l
搜索页面 - 监听下拉实现分页功能(8分钟)- k; @0 h% t( z
页面路由api与传参(13分钟)( q) O2 D$ @% k: I: K
页面跳转组件的使用(7分钟)1 y1 d+ `3 O9 k- A9 E6 r' M/ H
详情页 - 查询详情与视频渲染(8分钟)6 V7 [: c8 M( E3 Q! X
12构建搜索页-下
, B0 Z3 R) [! t& i5 H 构建预告片基本信息(16分钟)
! ^0 ]8 ?( B ] 构建评分快与阴影效果(15分钟)- b$ Q' H# B- ]2 a. w, ]; @
解决错误数据绑定undefined(5分钟)2 \1 Z/ c Z9 o
编写分割线以及剧情介绍(8分钟)
7 X. l- i- x) d0 }+ g 构建剧照与演职人员数据列表(10分钟)
1 V) p- a9 p } 渲染剧照列表(8分钟)
/ b: E; h; d% W1 i% ^9 Z 双拼数组构建演职人员列表(12分钟)% e, j! [; h3 J
渐进式导航栏设置(6分钟)
) o- `4 w% b0 o- w, G, B 通过预览api实现剧照预览(7分钟)% I3 P5 M1 `) z4 I* ]9 O I' r3 L
演职人员数组拼接预览(8分钟)
+ I$ }) a. u) \( j( M4 H. n13电影详情页构建
# \& I9 M0 L6 z& x7 E 自定义预览封面图(13分钟)
2 m$ u4 N# X) B$ v8 k C _) I actionSheet接口api使用(6分钟)
+ Y5 _0 i2 \# Z9 H* \ 下载以及保存图片(15分钟)! O H2 h5 I) @: J8 W
配置https下载合法域名(5分钟)% h* j ^+ I) y
实现小程序中的分享转发功能(9分钟): s& ]) ]& @; G# w3 W
自定义导航栏按钮(11分钟)8 ?' m" m& v5 I- r
分享到朋友圈(9分钟)1 {0 C! ~. Q$ ]6 ^1 T8 U% V. I
微信开放平台简单介绍(6分钟)" `0 l# x9 _7 D
操作视频对象，提高用户体验(8分钟). A* `! h: s# H* I. R2 v* \# Q
优化首页视频体验(13分钟)
: h/ m% v) F9 p" d& Y14我的页面（上）
$ P/ D* {6 T/ }6 e/ w 开发个人页面-header与导航栏设置(9分钟)
$ n. N$ n5 w7 u. \ 发个人页面-用户未登录和已登录的页面展示(9分钟)
2 W& ^) [& Q4 Q! s: r 构建注册登录页面(8分钟); u, N7 j8 w/ r' D9 n' p" Q" |
button与form组件讲解(6分钟)
9 l# ?3 F$ Z; K' X 实现一键注册登录(12分钟)
) d- o! x& {+ k 通过缓存切换是否登录状态(9分钟)
4 V/ V3 T0 Q% C9 c1 Q 构建用户账号页面(9分钟); T' h: M7 ]" G% T
清理所有缓存api(4分钟)
/ a6 ~1 n \2 g% C8 a- Y 用户登录错误提示与方法挂载(7分钟)
* F8 U9 I1 {: z9 ^6 y2 G 渲染用户信息数据(6分钟)$ l9 U, V* L: L% r
15我的页面（中）3 E* d3 _* e: o( n
用户退出登录(6分钟)$ l% E* P$ [) u: S, j1 N
第三方登录讲解与页面构建(16分钟)+ N" D5 r2 N7 z7 J: Q" V
第三方登录-小程序端实现微信登录(15分钟)
% m1 J/ G( \: o0 w6 c 第三方登录-后端登录业务梳理（辅助理解）(10分钟)
) ~. Z( }$ y5 t. c! j 第三方登录-app端授权登录(8分钟)
* e1 W( l/ |) h, P5 E8 S m 第三方登录-app端获取用户唯一id及信息(12分钟) s, X, @: j. P# @1 @
第三方登录-app端执行一键注册登录(7分钟)/ _. u" \+ N# q
查看预览用户头像(7分钟)
! w# u* B( l U 选择用户头像(11分钟): L7 k; [# V2 f9 T; Z1 j
重新选择头像(3分钟)( A; c$ z6 s: V- [( c) i
16我的页面（下）
, u, B- f9 @) n6 `- @ 文件上传api与后端接口讲解(5分钟). M. k! W4 C# U
token令牌讲解、实现头像上传(23分钟)
8 b3 w7 ?! C9 @8 e1 W: ~ 引入图片剪裁实现头像上传(7分钟)' d; F" O5 [# @
用户修改昵称(18分钟)
" c) K$ S5 }4 A, E 用户修改生日(17分钟)
! _& x i: J6 J" Y# ? U 用户修改性别(15分钟)
/ G2 M- ` X' M+ @6 Y% v k, t17项目发布与上线
$ r$ i' F+ {. H+ ^ 打包H5 web应用(5分钟)
) t, J8 A8 o6 Q4 H M 购买云服务与简介(6分钟)
O7 m& }: W: C& ` 配置安全组，重置密码，上传nginx，配置ssh(14分钟)
" k$ O2 d) c @, W 安装nginx(9分钟)
8 T" w" z4 k) h2 V. [7 Y 成功发布H5端web应用(14分钟)% z0 S/ e* b8 ?4 `8 Z
微信小程序上传审核流程讲解(8分钟)
; U5 n5 j) ~# `7 x. y; g8 W$ r- b 打包安卓apk(8分钟)
2 ^8 F3 J6 v$ z1 c4 G! g 简述ios打包(8分钟)
5 h9 M- W6 l' f9 e2 Y4 w18课程总结4 b& r( S: ]8 {5 @! `" z x
课程总结与展望(9分钟). C6 s! \& r0 i
- O) `) C. L# w+ R! d5 P, x$ g
& T4 t, Y: T" s. P/ c" S, i* ^
6 n2 \2 f$ o0 v q6 B |
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
