|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。5 ^( |0 v% S6 I
课程目录：7 G3 E g' J0 u# \) l
01导学
) X* M A. e; C 导学(12分钟) . g) v1 M+ ~7 a* D/ C" Y
学前必看！补充课：接口调用参数补充(6分钟)& O7 A6 @0 C& M5 W5 A$ p
基础框架NextHelloWorld(rar，513.7KB)/ W2 Q( a" W' A. X
超英预告最新源码(rar，8.7MB)
9 x* I, {0 r$ m# ?3 T linux工具与ngxin安装(rar，37.3MB)1 \0 u! U1 M' u& D
logo素材制作(rar，730.3KB)! i9 l, ~5 t4 v' H1 `- O
02课程介绍
+ `: `7 k. c0 ]+ X% N+ t# D3 i3 g 什么是 uni-app(4分钟)
9 ?) V, r" ~4 ~ 为什么要使用 uni-app(8分钟)
& c) T( v4 Q+ T3 {5 K- T2 t( ~% o app多端发布效果展示(7分钟)
* X5 L L. g+ Q& W2 I 使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)- N: N, n5 J8 v9 r. j* r
微信、支付宝小程序开发工具调试(7分钟)
1 R! T5 Q( m. u0 K6 R n 在Mac上使用Simulator进行调试(5分钟), }( Z6 C1 t; _1 _8 m) a$ B
03框架基础-上5 m; t' U! s4 t' o7 R; `
简述MVC模式(9分钟)' z8 J4 b) \6 h C
图说MVVM模式(5分钟)
& K( l/ u6 j# r z$ m A 通过代码阐述MVVM与双向绑定(12分钟)1 ^% c2 M. C5 S1 k4 J* x
JSON对象和数组的渲染(4分钟) Y8 Z- |8 Q% {2 z4 G
页面路由以及标题配置(11分钟)
1 L- A* L; U0 Y' r( }+ c: S8 O 宏观讲解项目配置文件(16分钟)5 M* x- i7 f U! d3 y
应用的生命周期(11分钟)+ U. O* O# R6 x. O# x+ o0 A
页面的生命周期(14分钟)
( r- J9 j/ v% @1 {4 y4 [1 j$ m6 Y 固定像素px与响应式像素upx(12分钟)
# Z9 z. [- y# [$ l! T 在页面里使用{{}}表达式(7分钟)# C b3 E6 n( S
04框架基础-下+ o+ q7 M5 r' D' P& E: h& D" C3 G4 y
v-bind指令对属性的数据绑定(7分钟)
% v* g* B; {/ `) g! N2 I( X 事件基础(22分钟)- o- o4 h* ^. {! p" i% V
条件渲染 v-if与v-show(7分钟)
+ g- V: m0 a1 y; T3 r( i' h* Z) e' ] 条件渲染 三元运算(4分钟)1 C4 _ f( Y* S' t9 u4 w$ C9 J
列表渲染v-for的使用(13分钟)
7 N2 \1 ]6 L9 a8 p; U; E& Z% W 指令key实现for循环的组件唯一性(12分钟)- O* i. T2 f, B; Y' O- ~
嵌套循环的下标定义(4分钟)' U- c, P1 B1 a5 p% q$ B
条件编译 - 上(10分钟)
; u p2 k8 a6 E, g( j 条件编译 - 下(7分钟)
1 b. c% i1 D+ d8 N05样式与flex布局-上: j; r$ b6 R0 F
flex布局介绍与模型(8分钟)
0 }% |# y; [' u- } flex-direction 元素的排列4种方向(10分钟)
- F. |( ?5 S" w 导入外部css样式(4分钟)
7 q3 a' T9 c6 K flex-wrap 元素的换行(12分钟)
8 f" y% K/ @9 S* E% }1 J justify-content 元素在主轴的对齐方式(14分钟)4 u6 O& a/ a0 A2 y( F, T" J
align-items 元素在交叉轴的对齐方式(12分钟)
9 L. i: {1 G% I* Z; q q06样式与flex布局-下2 f8 _. X' b! N, d
align-content 多轴线的对齐方式(13分钟)
# _0 d- y. y, @ flex成员项的属性 - order(4分钟)
S" B/ q1 y2 |; a% s flex成员项的属性 - flex-grow(4分钟). i; h6 F7 f* G: ?% H
flex成员项的属性 - flex-shrink(6分钟)
* ^+ v; R$ d. c- {# F6 b3 m flex成员项的属性 - flex-basis(4分钟)" z6 p0 }: t' c Y' r& w. S; \
flex成员项的属性 - align-self(6分钟)
2 a4 \+ O. ]4 f; J07开发首页-上
+ E9 V2 p% Q# h8 ? V 创建项目，构建基础页面(8分钟) 免费试学5 D1 E2 n. }6 T3 T
构建tabbar(13分钟) 免费试学
0 c, k8 N2 S5 s% W+ s% v& N 设置全局page，简述view组件(6分钟) 免费试学& M7 ~7 }8 B: z% c6 _( J% A- s
使用轮播图组件(11分钟) 免费试学
% Q/ c/ Q5 {) O 禁用原生导航栏达到页面全屏化(6分钟) 免费试学2 m6 v& _) f% Q6 F* i7 _8 N
在线文档的使用(8分钟) 免费试学
: S: t# s$ W& w4 a request网络请求api讲解(5分钟)
: I+ [# z7 `& ^, \ uni.request动态获得轮播图数据(9分钟)9 `# B l8 x( K! F% i& H5 b
箭头函数 this 作用域(4分钟)
" Z9 [; r( [: y3 p) k; T" K V 渲染并且展示轮播图(5分钟)
' i8 V Z$ j9 P. ]08开发首页-中
8 n- x6 N, e/ n 引入组件实现全局变量(7分钟)5 l+ B; a2 W% T% F! O7 p ~
使用挂载实现全局变量(4分钟)
+ O6 }3 I; e( }$ ?4 w* j5 I: } 在手机端进行微信小程序真机预览(6分钟)
. l" \( }% i: ]* T- P3 y' b5 e& u 微信小程序https使用事项(7分钟)
, Q/ e4 w. w, v+ ^* x 开发热门超英 - 标题(9分钟)2 }1 v2 f+ A: ^: W( H2 K
开发热门超英 - 简述scroll-view(4分钟)& e. R- t5 r$ `$ ]
开发热门超英-使用scroll-view实现横向滚动(3分钟)- n4 Q( _0 K B" v5 t9 Z6 i2 s% g
开发热门超英 - 海报与标题(8分钟)+ k6 F/ y3 n- h
开发热门超英 - 评分(6分钟)
" |8 G' ~, k/ h b$ v& q+ a 开发热门超英 - 动态渲染数据(8分钟)
" s- f7 P, a2 {' N# ^% h09开发首页-下1 {6 {( a' l3 b' X; b
开发自定义组件(7分钟)
1 c- i: }. z4 \. _( a! @ 父组件向自定义组件传入值(6分钟)) K3 w) C; z" ^8 y8 G
完成评分自定义组件(22分钟)
, \7 y, f) z5 o, E$ h- l+ u6 I 视频组件video讲解(9分钟)4 C6 {7 Q/ t: l5 ?. y( b
获取预告片数据(3分钟)4 e5 K) y. C& A- C5 s) E) h4 }
动态渲染预告片(10分钟)
' v. j" G. E! l% `2 J8 L 猜你喜欢 - flex布局嵌套编写(18分钟)# `1 C6 o( _* E- f4 Y6 Y
猜你喜欢 - 编写点赞css(7分钟)9 h* ~/ [& T* c2 ^
猜你喜欢 - 实现点赞动画效果(14分钟)3 I9 X! i& j8 h S
猜你喜欢 - 还原动画(5分钟)3 n7 Y! U j$ g5 A7 b
10开发首页-终8 J- ~2 z2 S; |; l- s0 R5 K6 G4 r
猜你喜欢 - 动态渲染列表(6分钟)
+ @4 f {0 @. N) Q7 ~) U 猜你喜欢 - 实现动画数组(7分钟)
5 Z) {+ }: U' \8 a* ~1 o 猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)
+ q0 A. _1 L/ T9 ~ 猜你喜欢 - 开启下拉刷新(5分钟)
! L/ g' W! H5 { 猜你喜欢 - loading交互api(8分钟)
m: l6 E9 K1 w( U2 [7 G11构建搜索页-上1 m+ }0 Z2 N6 H; R
搜索页面 - 编写搜索栏(19分钟)( A i2 y+ S0 T( [4 ~. }
搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)
+ u3 D' c# r: ?, x6 G( } 搜索页面 - 动态获取最新预告并且渲染(9分钟)4 y" b- ]3 F, y
搜索页面 - 分页接口api讲解(4分钟)" |0 s% l% b% O8 {1 V+ s1 y8 i
搜索页面 - 搜索前置准备(6分钟)
f5 F' M$ W! Q: L 搜索页面 - 执行搜索动态渲染(8分钟)
6 [% W' H* l5 Q" p 搜索页面 - 监听下拉实现分页功能(8分钟); _4 k! ]' H! x5 m' R/ v/ m+ K
页面路由api与传参(13分钟)
# ^" K8 }+ y3 C9 V% Y 页面跳转组件的使用(7分钟)1 N+ P5 B$ a& a/ {! j8 l' R
详情页 - 查询详情与视频渲染(8分钟)
5 g' _8 A6 N9 \5 Q4 ^! h3 I12构建搜索页-下
$ a) o7 e+ \' C* p# G! ?9 H 构建预告片基本信息(16分钟)
$ w% S# h+ n! ]5 P7 l$ Y1 }1 M 构建评分快与阴影效果(15分钟)2 ?( [. Y& g( q/ g( d
解决错误数据绑定undefined(5分钟)
, _6 t8 N8 f( P# [( k0 @8 W 编写分割线以及剧情介绍(8分钟)3 ~5 v$ W! H) m2 s. g; R
构建剧照与演职人员数据列表(10分钟)
/ d4 s" x8 a1 t3 b% ~ 渲染剧照列表(8分钟)
1 _% g+ O& y( O& W/ G P 双拼数组构建演职人员列表(12分钟); D U% v$ c E! E6 Q4 K" M2 |
渐进式导航栏设置(6分钟)1 ~8 G. E/ a; V; C
通过预览api实现剧照预览(7分钟)1 y$ F! d# N0 Q' }5 N! S( T
演职人员数组拼接预览(8分钟). {7 r! Y4 h" c# J' S* G1 j
13电影详情页构建
- m# J: o' q- k 自定义预览封面图(13分钟)
0 \7 P! K: a+ C- v! ?7 j6 `- O' T actionSheet接口api使用(6分钟)
/ q! o9 N% H( b0 M 下载以及保存图片(15分钟)6 {; U. O0 D) z! \* h$ K
配置https下载合法域名(5分钟)0 e# y# j; D2 q% N/ D
实现小程序中的分享转发功能(9分钟)
) R" K2 |, r' z) e) | 自定义导航栏按钮(11分钟)/ _7 u3 ~6 m6 T$ A$ G' _' ]
分享到朋友圈(9分钟)0 H+ P! P9 |4 U# N4 c
微信开放平台简单介绍(6分钟)
* u3 i& N7 g8 w- c6 L 操作视频对象，提高用户体验(8分钟)
+ u ?6 A: g% _4 D7 l+ }6 F 优化首页视频体验(13分钟)$ u9 y: t4 S) g7 T6 r/ C- y
14我的页面（上）
4 b# r+ U( S4 o 开发个人页面-header与导航栏设置(9分钟)
& f# h& Y, h0 m" g( i 发个人页面-用户未登录和已登录的页面展示(9分钟)
' Y* `: S: m8 @' _. y: O 构建注册登录页面(8分钟)
3 U2 F1 D Z. q$ O. v button与form组件讲解(6分钟)) `! i' X3 H9 P! w" m! H; L
实现一键注册登录(12分钟)% f" W7 C |2 V- ~! w; K8 |7 f0 P
通过缓存切换是否登录状态(9分钟)$ Q8 F2 \7 P# F( `. L
构建用户账号页面(9分钟)6 u3 x' R H( q" f8 V Z
清理所有缓存api(4分钟)
* O( c4 P+ K9 B9 G1 U4 b2 V6 }; w 用户登录错误提示与方法挂载(7分钟)6 ?* ]$ F8 n1 X, y
渲染用户信息数据(6分钟)) `' @, h; I1 M& {0 ^
15我的页面（中）
2 q' K( @% [* G) \ p( K 用户退出登录(6分钟)* [7 V' p' d* H4 ]* V/ T7 Q
第三方登录讲解与页面构建(16分钟)
# S& _/ x* |5 A1 {5 g" w2 @# g/ _ 第三方登录-小程序端实现微信登录(15分钟)! m) p) \4 @4 {, ~! A: G' e
第三方登录-后端登录业务梳理（辅助理解）(10分钟)) g C# b$ a' _# O2 w; c
第三方登录-app端授权登录(8分钟)
3 B& @4 b8 U7 M& l 第三方登录-app端获取用户唯一id及信息(12分钟)
" |- l0 B+ I2 e/ Y3 P 第三方登录-app端执行一键注册登录(7分钟)4 t* [4 E, V( \
查看预览用户头像(7分钟)$ p9 d* X; n4 y- \. \
选择用户头像(11分钟)9 |: i3 c1 B% d% s3 W9 r$ D
重新选择头像(3分钟)6 a' S7 S" I t' S4 L
16我的页面（下）
) ?: E8 s! h: h- l9 G" N( ]5 n 文件上传api与后端接口讲解(5分钟)6 k4 w5 z; F0 q8 [- K% }
token令牌讲解、实现头像上传(23分钟)& m3 q% I% } T; x3 J6 h
引入图片剪裁实现头像上传(7分钟)
2 j! ~' F) q* p* {& J0 f 用户修改昵称(18分钟)4 H9 ~4 ]2 V. h% K* R" L: T( b
用户修改生日(17分钟)* H' Y( m' n2 Y# N, d
用户修改性别(15分钟); L' h' ^6 h+ Y8 S
17项目发布与上线" [% l9 X2 ^0 x0 p/ `
打包H5 web应用(5分钟)
4 s; Z# M7 d C 购买云服务与简介(6分钟) d. D( g2 M3 s+ Y& f
配置安全组，重置密码，上传nginx，配置ssh(14分钟)1 J4 F' B2 G1 l9 ?
安装nginx(9分钟)
; c- ^. J$ _1 W 成功发布H5端web应用(14分钟)% n1 Q1 m# x# I
微信小程序上传审核流程讲解(8分钟)
8 t2 A0 n% B; Q D# N* D 打包安卓apk(8分钟)1 P. Q+ {$ ?2 Z1 _3 y$ ^3 S0 w
简述ios打包(8分钟)
, D4 M9 {" i. b9 u18课程总结 ?$ I0 _- G3 B* `, a7 |$ X+ g y- N
课程总结与展望(9分钟)" r: d1 t7 L6 g4 A" U# K0 F
. e0 m& f7 ^, j4 o; t. y
; j3 d. i/ q/ r
7 T5 o: c4 z0 B; G, h& v4 M |
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
