|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。$ ?) m; m' }/ C1 Y7 ^+ ?' L6 L9 r
课程目录：
6 w+ h4 m* I8 q7 O! a8 b01导学
5 m8 x$ _- s7 U" w 导学(12分钟)
" o( Q* ] p! i; t 学前必看！补充课：接口调用参数补充(6分钟)
1 x2 R9 W* c. O; _4 m 基础框架NextHelloWorld(rar，513.7KB)) c) i, ^+ H O
超英预告最新源码(rar，8.7MB)$ F+ g6 v/ h/ i4 D" O" \1 G8 |
linux工具与ngxin安装(rar，37.3MB)
1 l5 Z0 ?2 B( |5 C; ]4 P# w5 S logo素材制作(rar，730.3KB)
9 E6 U8 p+ Q$ G% Y; i* X. z( ~/ z1 b( x02课程介绍. ^% r; w$ k) f. S* `- ~8 n
什么是 uni-app(4分钟)
R( O# n, `: p- q, z7 s/ ?5 T 为什么要使用 uni-app(8分钟)8 i3 D7 y! z% H, ]2 X) G& ?
app多端发布效果展示(7分钟)
3 D: m% c: L u/ l' ^. U- Z 使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)8 L- e$ `. f% t4 G. t# v' K
微信、支付宝小程序开发工具调试(7分钟)/ l2 K( ]& p. Q3 `/ M
在Mac上使用Simulator进行调试(5分钟)
$ a5 Y. E" ~+ P# v03框架基础-上3 n: ^: N) g/ n5 K. u( q
简述MVC模式(9分钟)
3 Z3 R$ m5 Q, V8 \, g 图说MVVM模式(5分钟)
1 Q+ f; {4 w$ H( `8 H+ Z 通过代码阐述MVVM与双向绑定(12分钟)
; h' z. J" M, H1 i5 n JSON对象和数组的渲染(4分钟)
" u$ h" z2 [* `) f$ U+ |6 ~ 页面路由以及标题配置(11分钟)
, o9 a2 H9 y9 x6 j- e5 B1 s 宏观讲解项目配置文件(16分钟)/ a9 G6 I; u: ?& f& u$ s' W( e
应用的生命周期(11分钟)
! i& k+ @6 H+ T, Y9 _ 页面的生命周期(14分钟). t/ A) V3 G6 O" ~/ J% [
固定像素px与响应式像素upx(12分钟)
! f0 p. s8 i) _+ }+ C6 e& ] 在页面里使用{{}}表达式(7分钟)1 ~" z% b0 c0 P" j6 V, D2 V- J9 O
04框架基础-下
7 u1 X, I" t; L, y* G$ v v-bind指令对属性的数据绑定(7分钟)6 e( i( h5 b6 l* _3 [4 |
事件基础(22分钟)
, V3 z! [( C$ |9 |: E7 { 条件渲染 v-if与v-show(7分钟)6 i/ q0 y' M/ [5 [) m
条件渲染 三元运算(4分钟), N, t7 W. L( ?+ ?; r" Z
列表渲染v-for的使用(13分钟)
2 J3 Y0 _6 h0 Y, a8 B( c% E; F 指令key实现for循环的组件唯一性(12分钟)6 Z" J! C# {2 y: X l& `
嵌套循环的下标定义(4分钟)
) d7 b4 @ Y2 y5 R4 { a 条件编译 - 上(10分钟)
& A2 l6 v( e& |% R" o) ^ 条件编译 - 下(7分钟)0 w/ w- W% G. b' Q1 a* G1 y
05样式与flex布局-上5 n1 J' Y, t5 ^: n2 N
flex布局介绍与模型(8分钟)- b7 }* C7 G1 j' J
flex-direction 元素的排列4种方向(10分钟)9 ^/ U0 h3 x6 k
导入外部css样式(4分钟)" }( V; D, l! t
flex-wrap 元素的换行(12分钟)" R1 G, A' O5 p/ k: ~
justify-content 元素在主轴的对齐方式(14分钟)
* T& R( K3 Z8 }8 t align-items 元素在交叉轴的对齐方式(12分钟)
' u- X- }0 n% s/ X5 u" r06样式与flex布局-下/ b n; R* \! N+ Z& w8 s# W4 l
align-content 多轴线的对齐方式(13分钟): S* L2 t6 G$ ^5 k2 K/ |
flex成员项的属性 - order(4分钟)
3 A. M* Q3 T K flex成员项的属性 - flex-grow(4分钟)- q) w9 e6 C. V6 {% `
flex成员项的属性 - flex-shrink(6分钟)
4 x& _/ `+ O. I. V% a flex成员项的属性 - flex-basis(4分钟)
7 O0 G* ^* F% u flex成员项的属性 - align-self(6分钟)4 ]$ x, B8 {7 M- U' G
07开发首页-上
0 B: D+ F. P9 `: D( L( D 创建项目，构建基础页面(8分钟) 免费试学3 S& I5 a! _- t# v: D: K
构建tabbar(13分钟) 免费试学
6 O: ]6 v, H5 g |) t* W 设置全局page，简述view组件(6分钟) 免费试学
5 u% X8 G; j# w# {6 j 使用轮播图组件(11分钟) 免费试学
) |5 c, F' ~$ g 禁用原生导航栏达到页面全屏化(6分钟) 免费试学
" u% A# p2 {3 R/ q* y2 p* Q 在线文档的使用(8分钟) 免费试学
) O6 p& X9 c$ S6 `9 d% i request网络请求api讲解(5分钟)
2 J8 N8 H# o8 w7 ]/ h( u, Y6 b uni.request动态获得轮播图数据(9分钟)* H* C4 L1 ?! j( Q* V" m' k
箭头函数 this 作用域(4分钟)
2 [" C2 I K/ J3 Z7 X$ T 渲染并且展示轮播图(5分钟)/ s3 r# t; C5 O: x$ B; ^
08开发首页-中
! v9 ^% I% ]: F1 e) x4 o 引入组件实现全局变量(7分钟)* }# I9 W. w: w' M V
使用挂载实现全局变量(4分钟)) D& P( Z# R" F
在手机端进行微信小程序真机预览(6分钟), z' n! v* E. @( c/ h
微信小程序https使用事项(7分钟)8 b* X# h3 L4 _# v+ A
开发热门超英 - 标题(9分钟). W% u0 d: ~, {3 `+ r! G
开发热门超英 - 简述scroll-view(4分钟), b, e3 g$ W5 V; c+ G
开发热门超英-使用scroll-view实现横向滚动(3分钟)
: |7 K4 \! Q* o3 Y& a5 w 开发热门超英 - 海报与标题(8分钟)
+ V" `) ]9 W6 b! L8 K: j$ X 开发热门超英 - 评分(6分钟)
; R& C' f+ J& `0 q 开发热门超英 - 动态渲染数据(8分钟)0 o8 E. D8 l _& Z
09开发首页-下
* ]6 t* q' X o- g# \: e( D 开发自定义组件(7分钟)5 J1 l8 j9 Z( X- m- f$ L% g G
父组件向自定义组件传入值(6分钟)
0 `( W3 i. W, ` N! [ 完成评分自定义组件(22分钟)/ z' x6 d& e# `& I7 v
视频组件video讲解(9分钟)2 t: D" T' E( W
获取预告片数据(3分钟)9 p, ?& b$ ^- t+ l6 e$ y2 x! P8 q3 z
动态渲染预告片(10分钟)
0 p( u( D$ }! j/ B: [& i 猜你喜欢 - flex布局嵌套编写(18分钟)& L' H. j* H2 j1 I( d+ c
猜你喜欢 - 编写点赞css(7分钟)
( ?- C% @* v3 K: r1 d 猜你喜欢 - 实现点赞动画效果(14分钟)" y3 ^: J" {/ v* m
猜你喜欢 - 还原动画(5分钟)
, B0 N2 i* b* i( L% U9 F% L10开发首页-终0 q( Y5 {6 G1 w7 s
猜你喜欢 - 动态渲染列表(6分钟)+ R1 p. y) f5 `) n! F" D ^
猜你喜欢 - 实现动画数组(7分钟)5 H: H) B% X: G% w/ l: j
猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)
; f! P( F9 e7 I$ X! x7 ` 猜你喜欢 - 开启下拉刷新(5分钟)* f3 y+ S3 q3 J$ }9 n; O/ [( f
猜你喜欢 - loading交互api(8分钟)
9 s/ S2 [ ]% k3 n. `11构建搜索页-上4 _0 [' w/ W; v8 [! r/ b0 F" S- D
搜索页面 - 编写搜索栏(19分钟)
; e* r4 P0 z! N' d) e 搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)
8 c0 f8 m. I! f0 ?/ H 搜索页面 - 动态获取最新预告并且渲染(9分钟)+ E( `/ f" F+ N9 f( h; q9 d! e
搜索页面 - 分页接口api讲解(4分钟)
' |7 Y6 d" i" `3 ?% \ 搜索页面 - 搜索前置准备(6分钟)
# H. g1 A4 `& j. d) L 搜索页面 - 执行搜索动态渲染(8分钟)
* G% L( j: Q$ e5 [3 d; y 搜索页面 - 监听下拉实现分页功能(8分钟)
2 Z6 d% W8 Z/ _ 页面路由api与传参(13分钟)
+ U4 X# @/ s8 ] 页面跳转组件的使用(7分钟)+ H* M+ K* l. k ]+ s
详情页 - 查询详情与视频渲染(8分钟)
+ x2 U7 C5 `3 ~" t( x12构建搜索页-下: D/ m4 _6 y5 c6 |6 S% ^
构建预告片基本信息(16分钟)
1 |0 q* X* i8 }9 l) p0 i ^ 构建评分快与阴影效果(15分钟)4 M* J* l; m. q. }4 T. @ C
解决错误数据绑定undefined(5分钟)6 O# d6 |0 {( P! X, M
编写分割线以及剧情介绍(8分钟)
1 m2 U. l- F8 [/ E 构建剧照与演职人员数据列表(10分钟). @* E/ E& {$ t" |2 i
渲染剧照列表(8分钟)
: r9 R9 B6 j% J y7 z; Y1 k6 l 双拼数组构建演职人员列表(12分钟)0 ]) j( e& T' @! D8 S1 w; {) t) l/ _: S
渐进式导航栏设置(6分钟)
q/ ]0 m. J: e3 R6 @0 N$ D, V 通过预览api实现剧照预览(7分钟) ^, O+ N" H' a4 X
演职人员数组拼接预览(8分钟)
( o7 C- S" d# L: Y+ @8 H8 Q13电影详情页构建$ F q v' j+ f; M& o
自定义预览封面图(13分钟)
6 b' U: I, T& b8 Y+ O actionSheet接口api使用(6分钟)
3 y: g5 b0 b4 |9 } 下载以及保存图片(15分钟)
3 W6 [! d6 [& a$ [5 U; ]) o" ] 配置https下载合法域名(5分钟)
, S" K q1 ^, R) o: u0 d7 K 实现小程序中的分享转发功能(9分钟)
. U) L9 g4 k+ K% t5 ~/ J 自定义导航栏按钮(11分钟)
) d* f H8 j2 |9 ~& r 分享到朋友圈(9分钟): `5 Y' k) z* j6 U" B7 b$ H
微信开放平台简单介绍(6分钟). t- {$ w* k; W* ?1 L& Q
操作视频对象，提高用户体验(8分钟)
( F1 m/ _% W+ W& w 优化首页视频体验(13分钟)
2 i/ L% H- C/ H3 `- E# \14我的页面（上）
+ b) O* E4 ?' k 开发个人页面-header与导航栏设置(9分钟)
7 G6 ^; v2 P5 G% @3 A 发个人页面-用户未登录和已登录的页面展示(9分钟)
6 m$ Q7 @# B$ k4 J6 o; l0 J 构建注册登录页面(8分钟)4 U$ O* O4 J) k6 Y3 W2 M6 R! r
button与form组件讲解(6分钟)
, r5 C4 a4 B+ A) E. u 实现一键注册登录(12分钟)/ b$ N2 }1 l& T+ r8 o* @( H
通过缓存切换是否登录状态(9分钟)
8 S5 Y4 y+ d9 }$ d 构建用户账号页面(9分钟)
6 ^; O8 s- S6 {4 M$ p 清理所有缓存api(4分钟)
( J# D K4 [2 z3 |2 v+ z+ c 用户登录错误提示与方法挂载(7分钟)
3 m& S9 L+ Z5 k/ u( |! E 渲染用户信息数据(6分钟)0 [3 v$ m9 [! K& ~0 F$ y; Y- c$ ?0 R
15我的页面（中）
3 }7 Y; S, z6 S% d9 ` 用户退出登录(6分钟)5 R$ m: ?* @# G, M
第三方登录讲解与页面构建(16分钟)/ q% [" |+ `: `+ J* u
第三方登录-小程序端实现微信登录(15分钟)
; w* q+ y. E& e3 o8 W" \1 K4 ] 第三方登录-后端登录业务梳理（辅助理解）(10分钟)
$ p) b" V- j4 Q8 I) a 第三方登录-app端授权登录(8分钟)( p7 p( j( ]6 f0 `, e% L
第三方登录-app端获取用户唯一id及信息(12分钟)
6 Q' D' g* K& r6 K1 T a) v$ P 第三方登录-app端执行一键注册登录(7分钟)# e& B; g9 W' I; V
查看预览用户头像(7分钟)9 {0 F) l- g3 t& t8 Z" G4 \3 B, M
选择用户头像(11分钟)* Z; b7 l& a# p# ?) h
重新选择头像(3分钟)$ q8 g) P6 Y5 F+ S" v/ k; C) r& }; _, O
16我的页面（下）8 ]4 ~0 D) t; `0 ?
文件上传api与后端接口讲解(5分钟)
- y! t; l+ a) `( G# a7 X' e8 y token令牌讲解、实现头像上传(23分钟)
! y+ t# i( A& u 引入图片剪裁实现头像上传(7分钟)
}: X* ?& G0 F4 c 用户修改昵称(18分钟)$ W0 f! @6 G; x- Z
用户修改生日(17分钟)* i; c. ]% k. \# H1 F
用户修改性别(15分钟)9 [3 L1 Z6 O8 Q8 ^' l- I% g
17项目发布与上线
! [6 A" S' A, x5 g6 B 打包H5 web应用(5分钟)
& S [' m8 P0 i4 |, A 购买云服务与简介(6分钟)* }- B4 w( i# k* u( g) K" J y n
配置安全组，重置密码，上传nginx，配置ssh(14分钟)
& u; W: `1 q8 v' c, l3 C 安装nginx(9分钟)
% L3 R! U5 D; C2 k- } 成功发布H5端web应用(14分钟)1 T! B' }4 v( p% M
微信小程序上传审核流程讲解(8分钟): @) L) t/ y% L. b9 s6 ~2 P3 {
打包安卓apk(8分钟)
2 C( D8 l& H4 b 简述ios打包(8分钟)4 ?4 R- W" l, A
18课程总结
5 H9 [ h3 w6 _* p% e/ @ 课程总结与展望(9分钟)' z% d0 f9 d7 d5 H8 i+ K; T
# Z! g8 D! X& G/ j. e! m8 m$ v- Z7 C
: C6 t6 M/ ?+ z6 Z: f
$ g! Q+ o, O" S q0 f$ b |
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
