|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。
( L" @; s* ^3 Y6 \8 E" g课程目录：$ d' \2 U" }: M1 s1 m
01导学7 P$ ~6 e, J3 Q8 H6 v
导学(12分钟) " N- a- `) L9 C4 U* g" M2 b3 l
学前必看！补充课：接口调用参数补充(6分钟)7 u; z% H9 m: p: F1 o+ `, Q
基础框架NextHelloWorld(rar，513.7KB)
# f2 D. d1 G- I! t% U+ q3 x& f 超英预告最新源码(rar，8.7MB)
- M! n+ n8 Y6 j8 N+ g O( t linux工具与ngxin安装(rar，37.3MB)
9 \; y& f Z: ~* p) W" n logo素材制作(rar，730.3KB)% Z: c1 u F) w* n$ y
02课程介绍8 p G/ u" d: Z1 U; H; i9 @
什么是 uni-app(4分钟)9 s/ {* N' f6 j5 Q$ R
为什么要使用 uni-app(8分钟)
' V' W: E- `* ]0 }) _$ X) e# v8 n6 M app多端发布效果展示(7分钟)/ y3 U5 x! [7 ?. K2 M& V* b
使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)
! R* q# y3 Z6 U `' ` l 微信、支付宝小程序开发工具调试(7分钟)
& P% ~8 b4 O6 C 在Mac上使用Simulator进行调试(5分钟)
7 [0 z" ^# z3 f8 L03框架基础-上0 }( G: h4 a: n. a; {
简述MVC模式(9分钟)1 ?( b1 C+ w+ R ?9 y7 |
图说MVVM模式(5分钟)
% O, H+ h. [7 u" G9 [3 N 通过代码阐述MVVM与双向绑定(12分钟)$ h) c+ F- [9 L: f4 {0 O5 J" L
JSON对象和数组的渲染(4分钟)1 @5 j$ H+ G! M$ P
页面路由以及标题配置(11分钟); k& Z) O9 O- M% F% \( b' C2 O
宏观讲解项目配置文件(16分钟)! W4 @" U, b- S" m' \& K! Q
应用的生命周期(11分钟)2 }# x3 b) ~5 t# {
页面的生命周期(14分钟)
. u* X; Q* }: `% y' W2 A! ?1 Z0 i 固定像素px与响应式像素upx(12分钟). r- u6 c i+ u7 P
在页面里使用{{}}表达式(7分钟)
0 G8 S0 L2 Q+ V" W' x04框架基础-下
# U6 B: J2 ?' r7 [6 ` v-bind指令对属性的数据绑定(7分钟)9 ?7 W# K* a' h6 f5 Z. e/ @
事件基础(22分钟)
6 O* }6 G6 p) k0 q 条件渲染 v-if与v-show(7分钟)
2 |+ s: ]. |5 i" ]1 f0 E 条件渲染 三元运算(4分钟)
2 @" Q# h/ U2 g- V& r$ J 列表渲染v-for的使用(13分钟), m' W2 M: A. t2 h, T
指令key实现for循环的组件唯一性(12分钟)
/ W* V1 c7 w5 i, ]! R1 [: ^ 嵌套循环的下标定义(4分钟), ]: p( k8 g1 X5 P; V r
条件编译 - 上(10分钟), I. `; n" \( H5 R, ^+ J
条件编译 - 下(7分钟)' I2 h8 O# m, f: ~( c' Z# l
05样式与flex布局-上1 B& |* s& X& T9 m8 n! t5 y
flex布局介绍与模型(8分钟)7 z! p: M3 Z9 r* t Y" g ~! F
flex-direction 元素的排列4种方向(10分钟)
, j4 D5 B) ?) O; W# _ 导入外部css样式(4分钟)
: M9 j' b' O, a+ y& r flex-wrap 元素的换行(12分钟)7 M9 E3 S) h! a. {( x* m+ j7 @
justify-content 元素在主轴的对齐方式(14分钟)
3 ]9 b" j2 w' O. T, f! ?; e; _6 i align-items 元素在交叉轴的对齐方式(12分钟)+ h3 Y/ t; ] K9 q) [" J- ] U
06样式与flex布局-下
2 c1 b; f Q; P. I3 v# H3 L align-content 多轴线的对齐方式(13分钟). ]+ T0 b7 p! e3 a
flex成员项的属性 - order(4分钟)' L! e w/ P2 E; X% h$ J
flex成员项的属性 - flex-grow(4分钟)! O5 l6 I, k; y& E; ?8 W' ~
flex成员项的属性 - flex-shrink(6分钟)
* k1 h2 Y6 o; }0 d flex成员项的属性 - flex-basis(4分钟)
r. [8 F3 g f6 F flex成员项的属性 - align-self(6分钟)
) B1 j, x2 g" {" n9 p. l! B07开发首页-上
' [0 w) L9 u, @7 i1 w K2 I/ t/ C 创建项目，构建基础页面(8分钟) 免费试学# D* f% k( D: b5 Z/ j% |
构建tabbar(13分钟) 免费试学! Y- m* l& [: `
设置全局page，简述view组件(6分钟) 免费试学
|, `8 B* l# X# X5 z 使用轮播图组件(11分钟) 免费试学
% o' f5 o- n# G 禁用原生导航栏达到页面全屏化(6分钟) 免费试学
# C' B9 F! B6 v: |! P" Y 在线文档的使用(8分钟) 免费试学
0 W& [3 K& C8 B. p& W/ k; K request网络请求api讲解(5分钟)
, f6 F+ y" v6 n" _% | uni.request动态获得轮播图数据(9分钟)
* {& x: a/ a2 S, l/ X& o 箭头函数 this 作用域(4分钟)# U( B$ v2 D& c* O
渲染并且展示轮播图(5分钟)
V! d" H. M, w- C7 u& f08开发首页-中$ R' [4 k, G; k A7 P
引入组件实现全局变量(7分钟)) [0 {; i+ m6 C" ^7 [+ I. A" i
使用挂载实现全局变量(4分钟)
* c" V* x8 _2 r: i5 o 在手机端进行微信小程序真机预览(6分钟)
% @* B. k2 n, e5 ? 微信小程序https使用事项(7分钟)( N4 v# \, \6 K2 \* n- y5 h. J& b
开发热门超英 - 标题(9分钟)
" A+ m5 C! Y. e2 \3 M7 | 开发热门超英 - 简述scroll-view(4分钟)
. \1 M, T. D# e% Y) N+ M$ ^& F 开发热门超英-使用scroll-view实现横向滚动(3分钟), F3 T" E- Q; g4 |- f
开发热门超英 - 海报与标题(8分钟)/ x; h0 j0 w5 M) K; p% D9 s
开发热门超英 - 评分(6分钟)( D7 M4 R% v: @$ \8 Y
开发热门超英 - 动态渲染数据(8分钟)
0 n a4 T7 g2 }; K09开发首页-下 W f* p' B3 p
开发自定义组件(7分钟)! d* M7 r j" a. U: v8 p7 p' I/ J
父组件向自定义组件传入值(6分钟)
. i. ?, }/ K& v I2 }3 n/ y& ^ 完成评分自定义组件(22分钟)8 z1 C) b2 K& c2 r& T, U" M8 t
视频组件video讲解(9分钟)
! t( a1 F: T4 X4 V# \ 获取预告片数据(3分钟) \1 E( y7 V0 m# a+ ], X
动态渲染预告片(10分钟)7 {; k9 K- }* T- \
猜你喜欢 - flex布局嵌套编写(18分钟)% a. P- q( f* {+ u) b& @0 O: I
猜你喜欢 - 编写点赞css(7分钟)" F4 z" P" m8 Y' j, S* n) Y Y+ M8 Y
猜你喜欢 - 实现点赞动画效果(14分钟)# d9 L& J* A6 `* M) Z* ?
猜你喜欢 - 还原动画(5分钟)4 G5 J" y; Y/ [$ T: f! C. n
10开发首页-终1 s6 ^2 i! q/ F7 i5 e8 C" c
猜你喜欢 - 动态渲染列表(6分钟)
) A' K1 J; Y3 A: l 猜你喜欢 - 实现动画数组(7分钟) _0 S0 ^* g# }5 M: K
猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)
; S4 x# d' u b6 j8 `, R+ U2 [. r 猜你喜欢 - 开启下拉刷新(5分钟)
8 y' R6 a7 e( @7 z& t 猜你喜欢 - loading交互api(8分钟)9 Y* T; S7 ^0 O, o ^% ~8 D: e
11构建搜索页-上) C2 _. O# r, z1 r) H
搜索页面 - 编写搜索栏(19分钟)
3 S0 z; e5 ~: A* |) @' U$ A; j5 H 搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)
( [3 e# c V' J& E$ p" } 搜索页面 - 动态获取最新预告并且渲染(9分钟)
* v' O2 J* q, U. o! E& p( Z 搜索页面 - 分页接口api讲解(4分钟)
8 c" `( B6 b! f3 X3 Q0 ? 搜索页面 - 搜索前置准备(6分钟)
8 |! k: Z6 i6 P" E 搜索页面 - 执行搜索动态渲染(8分钟)
& `1 S4 j0 q; o8 A& l 搜索页面 - 监听下拉实现分页功能(8分钟)$ i+ ]/ o& o0 y! |( F. s& u7 U
页面路由api与传参(13分钟)
, Y2 i) d" U/ V8 b- _2 Q) B 页面跳转组件的使用(7分钟)
& i; p* J5 g7 ?. t 详情页 - 查询详情与视频渲染(8分钟)$ z% u) k( g, m. L8 F$ K# \6 a
12构建搜索页-下
/ K! d0 R" O( d+ y 构建预告片基本信息(16分钟)' a8 k# F( H7 |! d
构建评分快与阴影效果(15分钟)
; m" I% H: s7 T3 q 解决错误数据绑定undefined(5分钟)
9 R8 O, h2 M V$ C4 n8 ?5 U; `$ p$ `9 E ~ 编写分割线以及剧情介绍(8分钟)2 ]- B( E# F. E, T/ P/ I
构建剧照与演职人员数据列表(10分钟)
. _* M( ~8 n$ A- P) K6 v 渲染剧照列表(8分钟)
7 v) y. { ^7 h 双拼数组构建演职人员列表(12分钟)8 H7 g' K1 {) n" D4 o/ ?, o$ B6 ]
渐进式导航栏设置(6分钟)$ } H4 t z" Q, g. z
通过预览api实现剧照预览(7分钟)/ i4 k# {3 q) I2 B3 F- B2 C/ w
演职人员数组拼接预览(8分钟)! K/ M* M3 \+ T" G- B5 A
13电影详情页构建; L- c+ w3 C* l- b) F
自定义预览封面图(13分钟)
) g$ ?$ Z, I& i actionSheet接口api使用(6分钟)
- i0 {! V5 g. R6 c, v 下载以及保存图片(15分钟)+ z' Y( S2 i1 a2 e* d9 _
配置https下载合法域名(5分钟)- u3 z! Z# D/ C
实现小程序中的分享转发功能(9分钟)/ z4 D/ l$ U; K, _% I' R9 W1 y
自定义导航栏按钮(11分钟)
5 S* v- Q, }: O" f! D 分享到朋友圈(9分钟)
) q. d- Z! G. X0 _; q 微信开放平台简单介绍(6分钟)# f) N1 K# @1 D7 H( Y
操作视频对象，提高用户体验(8分钟)
5 l3 w- H; } @! D. k9 t! Z 优化首页视频体验(13分钟)
1 ?$ z9 Q6 Q! ^- m, B% t& C14我的页面（上）
% ^ k6 Q+ Q1 y' ?- l 开发个人页面-header与导航栏设置(9分钟)
) n; V% }" I- f/ S8 o' X 发个人页面-用户未登录和已登录的页面展示(9分钟)
( R3 s% F# C4 q1 x 构建注册登录页面(8分钟): {" D/ v3 `2 Y6 q
button与form组件讲解(6分钟) V% T8 a% J; L
实现一键注册登录(12分钟)& S9 |! G* M/ Y/ Y: n* c
通过缓存切换是否登录状态(9分钟)
. i* X/ W) L' U5 u 构建用户账号页面(9分钟)
7 n/ K2 t. J, j! T5 u: Q5 w3 ]0 | 清理所有缓存api(4分钟)' S5 Q! v2 @# h2 N
用户登录错误提示与方法挂载(7分钟)
6 i: ]5 S* [/ g$ l- c 渲染用户信息数据(6分钟)
3 v- U+ q. ]' X* k4 B$ }% z. S4 ]15我的页面（中）4 \7 z! X% p `" S( z
用户退出登录(6分钟)
2 D. f, z0 x" S i: c4 }" | 第三方登录讲解与页面构建(16分钟)- Y8 S7 j# C, A: J4 E4 Z3 B8 ]. ?
第三方登录-小程序端实现微信登录(15分钟)
; q- z% o; ^8 N+ V) q/ v e& D 第三方登录-后端登录业务梳理（辅助理解）(10分钟)
% k* d, x6 w. R. N- ]# f 第三方登录-app端授权登录(8分钟)
- y* D, P, G6 o3 j, [) \) ` 第三方登录-app端获取用户唯一id及信息(12分钟)9 f& s6 e$ w7 k2 I6 M8 w& K% f7 S* G
第三方登录-app端执行一键注册登录(7分钟)# b4 u: J8 q2 k: }( f
查看预览用户头像(7分钟); U* w3 g- X) t
选择用户头像(11分钟)
/ P" \; [* t3 }1 c' @% d 重新选择头像(3分钟). B1 D8 r$ Z; C4 g9 O, R0 S8 w
16我的页面（下）4 {( s: I5 V0 T: G( E
文件上传api与后端接口讲解(5分钟)* s! h! T! D" ^3 J D: u
token令牌讲解、实现头像上传(23分钟). l2 S8 _% L8 ~% G4 B) B
引入图片剪裁实现头像上传(7分钟)
q. |( x; r a 用户修改昵称(18分钟)
" j6 Y" F( D" T- o+ n 用户修改生日(17分钟)8 Q8 j, k, k% _! A0 L( [5 [! l* M' z
用户修改性别(15分钟)
: J$ j# o$ ?" V5 k, C17项目发布与上线
6 c1 _, l' U6 x& M/ h/ W! Z 打包H5 web应用(5分钟)5 b, I/ ~/ s- G9 B! K l
购买云服务与简介(6分钟)3 J" k& O+ ^2 w0 g8 \6 M9 _+ a
配置安全组，重置密码，上传nginx，配置ssh(14分钟)/ K5 B" _& g/ k' m& d
安装nginx(9分钟)
5 m m) P% j X" }1 a$ C# D' n 成功发布H5端web应用(14分钟)
8 V9 X; W. E& ?! F 微信小程序上传审核流程讲解(8分钟)9 W9 Z, C0 x9 m/ p _
打包安卓apk(8分钟)( d+ y1 C) i7 d9 J+ f
简述ios打包(8分钟); P8 z# ~) T x0 K- f! p
18课程总结2 Z" C; Z$ r7 k* I; f' d# |. U
课程总结与展望(9分钟)
* X( J/ r& q. s5 i$ r8 D& b% U, I. Y& O
5 v' p7 G" x) H& H! x! G
. O- |! E' a! T, V$ ]
|
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
