|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。
* l. m9 u4 z( n i W课程目录：
; A H$ }! g3 ?# m5 W; U01导学
) P+ D8 j! S: ?" \) F0 Y 导学(12分钟)
% X. G5 T0 T; G: |8 @( C 学前必看！补充课：接口调用参数补充(6分钟)
2 h% r) e! P0 j; x 基础框架NextHelloWorld(rar，513.7KB)" i7 x- z4 O+ t$ ] u6 Y! [5 Z; G
超英预告最新源码(rar，8.7MB)' C" o4 H/ L0 k
linux工具与ngxin安装(rar，37.3MB)4 O; P; i& V# l1 C
logo素材制作(rar，730.3KB)
" S; P6 R- O; s+ E1 h, f# Z02课程介绍
9 v' J) l( Z' @# x 什么是 uni-app(4分钟)/ g: _: v0 U* b. u0 {- d) K
为什么要使用 uni-app(8分钟)
/ W: Q e& F/ f) D3 g app多端发布效果展示(7分钟), C s& i/ e* o# P) x2 Q4 p
使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)5 E# z9 D' n. x1 K' L1 q
微信、支付宝小程序开发工具调试(7分钟). O, ^9 E% R8 s% i
在Mac上使用Simulator进行调试(5分钟)6 R7 S. e; ~$ M
03框架基础-上: Q4 \, l( X- p% E
简述MVC模式(9分钟)3 M! K h. t7 Q0 j! M
图说MVVM模式(5分钟)* V* [- W3 {' C1 Q
通过代码阐述MVVM与双向绑定(12分钟)$ r# w3 n1 d+ X/ T
JSON对象和数组的渲染(4分钟)9 D/ j* K8 f! h8 p; ~
页面路由以及标题配置(11分钟)
# o; O) D( _7 u0 d; h: x 宏观讲解项目配置文件(16分钟)
; D/ l; _& q1 e' ? 应用的生命周期(11分钟); H) ?1 B! i: H0 ]( }3 @
页面的生命周期(14分钟) f1 c! ]! V6 z
固定像素px与响应式像素upx(12分钟)
" [: b7 x* ]0 V: }( B0 Z 在页面里使用{{}}表达式(7分钟): W' H; t* J. D+ r2 X4 B) U8 s+ O
04框架基础-下% ? p$ Z% c( \9 Q
v-bind指令对属性的数据绑定(7分钟)
) g5 j' j) w9 T6 ~ 事件基础(22分钟)
4 b" M6 ?2 ~( V* ~1 ~' m) } 条件渲染 v-if与v-show(7分钟) @+ e* R1 [2 e Y( a3 m7 k
条件渲染 三元运算(4分钟)
' t6 n7 N3 c2 _: { 列表渲染v-for的使用(13分钟)
$ d) S: Z( P1 b" R" k! J0 m3 z" d 指令key实现for循环的组件唯一性(12分钟)
; v3 T& ]8 p B3 [ 嵌套循环的下标定义(4分钟)
) z/ L# H" b0 t$ ~, {6 n 条件编译 - 上(10分钟)! `9 Y, `6 J) a% i
条件编译 - 下(7分钟)
9 T% A" e' G: |) F05样式与flex布局-上2 Q5 h. |/ U+ M7 s* j
flex布局介绍与模型(8分钟)" N/ o) {$ C% l4 \9 Q; r
flex-direction 元素的排列4种方向(10分钟)- ` g7 B; E: i6 H g
导入外部css样式(4分钟)
% ^3 g" l2 C# R. I4 l B1 ? flex-wrap 元素的换行(12分钟)4 M1 Z! i4 f5 V4 x% r$ d* g5 T! p( u0 P
justify-content 元素在主轴的对齐方式(14分钟)
2 N' {1 e" d) K& z5 j7 h align-items 元素在交叉轴的对齐方式(12分钟)/ D' L+ |# m! X4 Z
06样式与flex布局-下
/ v4 r6 Y- M0 q- z6 N; H- k# N align-content 多轴线的对齐方式(13分钟)% B, X6 k9 U& D! p
flex成员项的属性 - order(4分钟): I# s/ U5 p- } b
flex成员项的属性 - flex-grow(4分钟)+ B% G9 }# O; t; p% N* y
flex成员项的属性 - flex-shrink(6分钟)! m% E% t- }9 s. S
flex成员项的属性 - flex-basis(4分钟)" `* b* g: s% p* w; W
flex成员项的属性 - align-self(6分钟)
, K( g( p3 k7 x07开发首页-上6 I) b5 `8 ?- E i+ B' j
创建项目，构建基础页面(8分钟) 免费试学
3 ? m ^6 p' O 构建tabbar(13分钟) 免费试学 M% P1 O/ f6 N2 s) Z
设置全局page，简述view组件(6分钟) 免费试学
@, @+ a7 Q m! R8 y) U 使用轮播图组件(11分钟) 免费试学: c& a$ N$ y: G
禁用原生导航栏达到页面全屏化(6分钟) 免费试学/ f3 a& H* i! I4 ]
在线文档的使用(8分钟) 免费试学) k x; b0 K- J1 h- E2 y/ [& ~
request网络请求api讲解(5分钟)
; f. W# [; S% ~. t+ h7 r uni.request动态获得轮播图数据(9分钟)
% f( R! v/ d. p. x! O 箭头函数 this 作用域(4分钟)
, M# |; `+ {+ O3 _+ W2 I( }- k 渲染并且展示轮播图(5分钟)# N5 R- t" o# v5 h, G1 S$ N _, B
08开发首页-中
4 f/ x! i6 j. f* M 引入组件实现全局变量(7分钟)
2 q% z" m1 Z$ O5 O# R# h0 c 使用挂载实现全局变量(4分钟)
# ^0 Z5 R) P6 j 在手机端进行微信小程序真机预览(6分钟)' T# ^/ J9 Y" S
微信小程序https使用事项(7分钟)
1 k" n/ I! _% c$ U) Q 开发热门超英 - 标题(9分钟)
/ j' _ R2 Q: q! H 开发热门超英 - 简述scroll-view(4分钟)
5 e. Z5 j; `' e) D ` 开发热门超英-使用scroll-view实现横向滚动(3分钟)
0 I8 Y0 S# C0 y3 u 开发热门超英 - 海报与标题(8分钟)
( e( _- S: s0 H 开发热门超英 - 评分(6分钟)
8 f# Y, O y- [; F; f 开发热门超英 - 动态渲染数据(8分钟)
. p, e5 i& l. G3 `09开发首页-下
1 D0 o: T4 s+ H { 开发自定义组件(7分钟)$ b: O. C5 q, Q/ z
父组件向自定义组件传入值(6分钟)
$ D9 q0 _& S E9 Z" A R 完成评分自定义组件(22分钟)
5 B( n" [+ u, C, S8 I( n 视频组件video讲解(9分钟)* ^! i* r8 }% ^5 C2 i' y
获取预告片数据(3分钟)
/ a7 I \3 M' t; ~ 动态渲染预告片(10分钟)* {- w: k- a* r3 X
猜你喜欢 - flex布局嵌套编写(18分钟)
0 c% b" {: b# a, X& D6 g7 C5 M7 }( j 猜你喜欢 - 编写点赞css(7分钟)
4 H1 D& a' o6 S$ @ 猜你喜欢 - 实现点赞动画效果(14分钟)2 \0 m9 T& Z3 w2 R
猜你喜欢 - 还原动画(5分钟)
3 C2 D, z* }; `6 Z5 b! m' g, g10开发首页-终- y9 {6 y; v! y; H0 U V3 Y
猜你喜欢 - 动态渲染列表(6分钟)4 F8 X1 `9 [$ w3 g, D; |
猜你喜欢 - 实现动画数组(7分钟)% r( ^" K# n8 r3 f) O
猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)5 r* U q; ^% D' n
猜你喜欢 - 开启下拉刷新(5分钟)
* h: p5 X5 G4 z" J2 { 猜你喜欢 - loading交互api(8分钟)3 k. q+ j. H: c1 x
11构建搜索页-上
# x5 r4 \8 T! i A0 M 搜索页面 - 编写搜索栏(19分钟)
) z5 N1 M5 g( a& r7 ?+ `$ H/ X8 { 搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)/ L! v0 }8 d' ^
搜索页面 - 动态获取最新预告并且渲染(9分钟)/ P5 S* ~2 s U+ |+ {1 M4 G1 j
搜索页面 - 分页接口api讲解(4分钟). R' V$ {$ o: m/ f+ c ~
搜索页面 - 搜索前置准备(6分钟)
3 G9 _1 }. l/ s: ^5 d* m 搜索页面 - 执行搜索动态渲染(8分钟)) F3 e# K2 O6 `" O, K) v: K
搜索页面 - 监听下拉实现分页功能(8分钟)
6 i+ o) E8 U1 F0 B' A, F4 k" ^# E( i, G 页面路由api与传参(13分钟)) t! W6 b. U9 j q
页面跳转组件的使用(7分钟)* R. i' ~, U7 s/ _8 H9 ~
详情页 - 查询详情与视频渲染(8分钟)
+ y# U0 p5 _# j9 ` u12构建搜索页-下
' g) w1 u4 w* Y- g) X' J0 J" M 构建预告片基本信息(16分钟)- F% j; C( t1 a' k, @) K/ M
构建评分快与阴影效果(15分钟)& n ?) T; L6 ]; J( X9 @
解决错误数据绑定undefined(5分钟)
- H2 ~( [5 u* ] ^% P# | 编写分割线以及剧情介绍(8分钟), x$ i2 T3 D. j
构建剧照与演职人员数据列表(10分钟)
1 e7 x: ^& `6 n. Q: z$ x) D 渲染剧照列表(8分钟)
) a' H; y; i% n$ } 双拼数组构建演职人员列表(12分钟)
& K6 g/ [, u. Z* }! a+ q 渐进式导航栏设置(6分钟): M8 H! \( \6 f4 x+ ~: K" q
通过预览api实现剧照预览(7分钟)
. K) t U; c) w, g- r7 b+ F& E 演职人员数组拼接预览(8分钟)
4 a% [' K4 q! ~& q' U13电影详情页构建
: t/ u q" Z3 E# p+ l" C 自定义预览封面图(13分钟)
1 ? v' P- i* k' \* z actionSheet接口api使用(6分钟)
( |& `" i" ?4 E% f 下载以及保存图片(15分钟)9 J8 }5 \: t* c7 a' c5 Q$ c. ~
配置https下载合法域名(5分钟)5 s1 s0 `! z4 W( I
实现小程序中的分享转发功能(9分钟)
; x( H! m, V2 @: _ 自定义导航栏按钮(11分钟)
; \4 Z3 C5 M( g; V4 l2 T 分享到朋友圈(9分钟)$ [6 F8 l" ~( g$ p0 n8 b
微信开放平台简单介绍(6分钟)) d4 q* f6 \, L4 j3 ], {3 l; _
操作视频对象，提高用户体验(8分钟)
& F4 {4 c5 ?) \% `5 ]4 ? 优化首页视频体验(13分钟)0 V0 a5 V2 K# ~6 \; W
14我的页面（上）0 S9 f: N$ Y" M8 ]: F5 }5 A+ i* ?
开发个人页面-header与导航栏设置(9分钟)
# o4 H( |* t- c 发个人页面-用户未登录和已登录的页面展示(9分钟)
; k4 Y3 T7 @0 C0 ]. c 构建注册登录页面(8分钟)
& c* h$ k, ~& b4 m button与form组件讲解(6分钟)9 C% n3 [+ T& g K; c# q7 E
实现一键注册登录(12分钟); X7 e3 A9 c: X3 k' X) @/ ^5 h8 e& Z
通过缓存切换是否登录状态(9分钟)7 y4 d* `7 J9 I
构建用户账号页面(9分钟)
" y3 } F" f' L& H L* k 清理所有缓存api(4分钟)5 v! j( M4 b* A( G
用户登录错误提示与方法挂载(7分钟), P9 H# N' g3 z5 q" i
渲染用户信息数据(6分钟)7 W- h# p6 c2 I) |. ~" ]
15我的页面（中）* |/ r0 n( X6 }! L' L& e
用户退出登录(6分钟)! P* ~& D$ R) [4 G& r u
第三方登录讲解与页面构建(16分钟)4 H% i. P; S0 E9 }$ n# H$ \
第三方登录-小程序端实现微信登录(15分钟)1 k; Z' ^- K% M( z& A
第三方登录-后端登录业务梳理（辅助理解）(10分钟)
* [6 s8 G3 ]0 G! F& T+ Q1 S% | 第三方登录-app端授权登录(8分钟)
. h# b* J* P0 ^ 第三方登录-app端获取用户唯一id及信息(12分钟)5 F, i# k; O6 D6 l! T3 Q7 q
第三方登录-app端执行一键注册登录(7分钟)" ] N1 A, u4 U) }" X1 x
查看预览用户头像(7分钟)
$ U3 w7 `" j) e* C, J 选择用户头像(11分钟)
0 o. e& T: \, n1 t8 \7 V$ m 重新选择头像(3分钟)3 U- s9 {; Y; |' y+ @- ^, J
16我的页面（下）
% Z1 [) o& e1 {7 R' a 文件上传api与后端接口讲解(5分钟)# X- H5 p% W' Z$ h4 b7 N
token令牌讲解、实现头像上传(23分钟)
, V! L: n3 a1 G, ?+ I" P 引入图片剪裁实现头像上传(7分钟)
# H( j' f% f5 X" J! T 用户修改昵称(18分钟)/ b7 y: p1 X7 \) y3 {
用户修改生日(17分钟)1 t( j5 O7 R b9 m
用户修改性别(15分钟)- }% i y+ n) C) ]
17项目发布与上线- I1 b) P. _. ?* K% |8 d& R4 ]
打包H5 web应用(5分钟)
1 Y( q9 Q& I6 I9 L* f 购买云服务与简介(6分钟)
4 r1 ?0 e9 ]/ L% E7 n) r 配置安全组，重置密码，上传nginx，配置ssh(14分钟)5 \& o& \) [. R# s. q
安装nginx(9分钟)) m& K% i: d8 k- R" Z
成功发布H5端web应用(14分钟). f8 q/ X/ k. U: d2 U. z: _6 l
微信小程序上传审核流程讲解(8分钟)! } X+ l5 x1 D0 v% B- C. I
打包安卓apk(8分钟)7 n j z; d4 t+ }
简述ios打包(8分钟)
0 ~( d1 _/ x+ f' S0 L( Z$ F18课程总结
* J% g9 Y+ R, u: O" o; W 课程总结与展望(9分钟)
2 [* o+ }# o6 _( J" S2 {& B2 W9 i& h4 L) r% q% h
, s& R# I7 L4 ]0 Y2 G, _: C& z
; z# v, m! y% @( d+ |5 G7 X' W% l |
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
