|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。! ^6 F2 ?6 e# V% z% {
课程目录：
4 A5 X1 N! c( B, v; [01导学
5 [" {1 T; g" q1 ^& s 导学(12分钟) 4 T& o% C: h6 |. ~. E0 C
学前必看！补充课：接口调用参数补充(6分钟)2 Z3 t8 J/ R7 a: z" |, u) w) i
基础框架NextHelloWorld(rar，513.7KB)4 k# ?, O: P! F# k0 P: T& e9 X
超英预告最新源码(rar，8.7MB)
8 i3 q' }& v1 V. Q2 C/ i' D$ m9 ?, C linux工具与ngxin安装(rar，37.3MB)
6 w q3 \' D2 Y logo素材制作(rar，730.3KB)
' ]/ Q% ~! l$ G5 \02课程介绍5 z& H/ T; q' F3 E9 s
什么是 uni-app(4分钟)
6 Z/ ~5 X. P$ u% F; W, k9 `/ U# H 为什么要使用 uni-app(8分钟)1 Z$ {5 X6 y( [1 p
app多端发布效果展示(7分钟)
7 d# B, C8 F- V* ~3 D1 D$ |$ \ 使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)
$ v" p8 Y) V8 f$ u$ W4 t& p 微信、支付宝小程序开发工具调试(7分钟)
1 ~7 B* P, e2 D# t* ^8 @ 在Mac上使用Simulator进行调试(5分钟). X" {" d2 }" j8 i3 `$ D! a
03框架基础-上1 ~2 v; B( I, V3 }, {; y
简述MVC模式(9分钟)
4 V6 H7 ?, U) p- T- z 图说MVVM模式(5分钟)
$ I; L- z: x+ O q4 D# {1 d 通过代码阐述MVVM与双向绑定(12分钟)1 c" b& t6 d/ i, ?! g6 g
JSON对象和数组的渲染(4分钟)
0 `# i3 A1 l$ F+ G; h 页面路由以及标题配置(11分钟)7 q+ l4 G, N) R# b
宏观讲解项目配置文件(16分钟)
2 ^3 Y8 K8 s! q' [% {9 G: e4 ]! ~ 应用的生命周期(11分钟)" V! j, N- Y" S* {7 j
页面的生命周期(14分钟)
; e; q$ Q. B" x+ A5 ~. V& z 固定像素px与响应式像素upx(12分钟)% E `* \/ U$ K2 R3 E. }
在页面里使用{{}}表达式(7分钟)
8 F: k" H+ k5 i2 I, W04框架基础-下 E8 e4 R; N0 i2 I
v-bind指令对属性的数据绑定(7分钟)
8 n$ }% b5 p: H& v/ e 事件基础(22分钟)2 A u, J+ o4 W. U' T! O4 d
条件渲染 v-if与v-show(7分钟)
. G P' n9 A- i9 s) i v6 O 条件渲染 三元运算(4分钟)0 z5 ^4 z+ |/ e5 d" U% K! h
列表渲染v-for的使用(13分钟)* |1 |0 C3 P2 {
指令key实现for循环的组件唯一性(12分钟)8 |4 I B# c7 s" L+ @
嵌套循环的下标定义(4分钟)) y4 {) I3 b- J* v3 J
条件编译 - 上(10分钟)- {" z6 J0 j: n4 @" y4 `% k% z1 i
条件编译 - 下(7分钟)2 h: Q: b- U2 [+ S# @
05样式与flex布局-上
8 @- \; ]2 @4 s7 H flex布局介绍与模型(8分钟)
! g. m# S$ Z$ V* P& X' v flex-direction 元素的排列4种方向(10分钟)
6 U6 q2 m0 m3 v' g$ [. `( U 导入外部css样式(4分钟)1 D6 \; K% o5 j0 @ w, V5 J3 }+ N
flex-wrap 元素的换行(12分钟)( p4 X7 M2 ~4 [
justify-content 元素在主轴的对齐方式(14分钟) n2 Z! G1 S1 q9 J
align-items 元素在交叉轴的对齐方式(12分钟)6 ^, D! [/ p6 f
06样式与flex布局-下 f& r( H4 w8 J0 L8 U
align-content 多轴线的对齐方式(13分钟)( k5 {* k0 Z* f1 D8 j7 o8 m
flex成员项的属性 - order(4分钟)) t) g5 C1 K6 J/ u: f' p$ y) G$ P/ g
flex成员项的属性 - flex-grow(4分钟)
3 m& X1 t( L Q: K6 [ flex成员项的属性 - flex-shrink(6分钟)* q2 }; `7 U: G
flex成员项的属性 - flex-basis(4分钟)' k0 c- s( p$ x1 X5 q* |3 s
flex成员项的属性 - align-self(6分钟)+ a- J& z q4 @- x
07开发首页-上
0 S3 @3 g+ ?) c' G- E4 p1 q 创建项目，构建基础页面(8分钟) 免费试学0 |" E; p: L/ Z( p3 J1 f
构建tabbar(13分钟) 免费试学/ P! ~+ v* N9 K W% L/ C6 |
设置全局page，简述view组件(6分钟) 免费试学! b& b z, u! z9 u3 Z% W+ h
使用轮播图组件(11分钟) 免费试学 m3 l1 x2 M0 h. _4 q! s9 q6 B
禁用原生导航栏达到页面全屏化(6分钟) 免费试学
( Z8 c( Y* w# \/ | 在线文档的使用(8分钟) 免费试学- k6 j$ g6 Z8 o s9 x j. N
request网络请求api讲解(5分钟): }8 ]. m: {/ r) R. z2 t% B
uni.request动态获得轮播图数据(9分钟)- n$ I/ v. d2 l$ c" T4 Y
箭头函数 this 作用域(4分钟)9 b/ m& T. x! \. h
渲染并且展示轮播图(5分钟)4 m6 H3 ?, R& K1 l) v0 ^: q) D
08开发首页-中
8 n8 w' r' a4 i% S& m 引入组件实现全局变量(7分钟)) Z5 A* q9 U+ ~% m3 j0 B0 |
使用挂载实现全局变量(4分钟)
' c3 q' D8 |9 n9 Y: y3 ~ 在手机端进行微信小程序真机预览(6分钟)
b! K6 g9 @3 V+ V( b 微信小程序https使用事项(7分钟)% |$ g$ }% O4 w3 m% a
开发热门超英 - 标题(9分钟)
- J- [) K& m6 e* a" V0 {, D) b% | 开发热门超英 - 简述scroll-view(4分钟) a+ M0 M/ Y6 H6 U# P9 g
开发热门超英-使用scroll-view实现横向滚动(3分钟)6 W2 d4 L j" |. R7 K; T8 O
开发热门超英 - 海报与标题(8分钟)
+ o8 }# r7 m! R: d" u& u- a1 L 开发热门超英 - 评分(6分钟)
5 l1 C" [3 K* b# O; I2 u3 S& s 开发热门超英 - 动态渲染数据(8分钟)& P0 r* b) \, E8 a) u5 b
09开发首页-下
2 ~8 d% {* o1 n( H% a3 L, z) B 开发自定义组件(7分钟)
# T+ f( V4 z9 C) _3 O# ? 父组件向自定义组件传入值(6分钟), q8 `- f$ V% F
完成评分自定义组件(22分钟)
; F2 C3 P: X# J7 H 视频组件video讲解(9分钟)
W! i( Z9 k! t7 m9 C8 E 获取预告片数据(3分钟)
: [/ m& o: K- ?; ` 动态渲染预告片(10分钟) ? A* J4 e3 G4 O6 R4 o
猜你喜欢 - flex布局嵌套编写(18分钟)
( c6 ]# B* E7 c2 h; | 猜你喜欢 - 编写点赞css(7分钟)
5 Q, n! H9 L$ E7 m. G3 q/ n7 W 猜你喜欢 - 实现点赞动画效果(14分钟)
: s+ j; C8 R* O 猜你喜欢 - 还原动画(5分钟)3 a* p1 y% X" h/ U( G
10开发首页-终
$ P' g' K; R, y+ B# d7 { 猜你喜欢 - 动态渲染列表(6分钟)% I4 R# p7 X X
猜你喜欢 - 实现动画数组(7分钟); r( U& ?& t4 M( K
猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)- m6 g4 `0 R d& b" [% s
猜你喜欢 - 开启下拉刷新(5分钟)6 a9 h9 B9 |3 R1 d7 _
猜你喜欢 - loading交互api(8分钟)
* c* U3 m" B7 j! U. [11构建搜索页-上
7 I0 @& y+ Y* q' F' T 搜索页面 - 编写搜索栏(19分钟)
; ]" N' v8 a5 E2 n1 P 搜索页面 - 编写预告片列表、搜索栏置顶(9分钟) c% B9 K; F2 d6 R. C2 s
搜索页面 - 动态获取最新预告并且渲染(9分钟)
( g+ x, R6 |! l& R8 d 搜索页面 - 分页接口api讲解(4分钟)8 ^$ \ P7 N" _' F/ W+ c( @
搜索页面 - 搜索前置准备(6分钟)) B) Y$ ^& }2 O- l/ u* s5 m1 ^3 v
搜索页面 - 执行搜索动态渲染(8分钟)
( |. b. M) D7 U1 @1 B: _ 搜索页面 - 监听下拉实现分页功能(8分钟)
, f+ \; R+ j9 [0 I3 L 页面路由api与传参(13分钟)
+ d2 H8 V- I2 b 页面跳转组件的使用(7分钟)
" A: _( @* `5 j( M 详情页 - 查询详情与视频渲染(8分钟)" r+ e6 b0 J, n3 g# g
12构建搜索页-下' H. r+ w- q- y$ r" \
构建预告片基本信息(16分钟)
4 T @5 O5 `. m. d& w3 n 构建评分快与阴影效果(15分钟)
/ K, \2 B* I* W) b 解决错误数据绑定undefined(5分钟)( \0 i# ?$ \' F P z
编写分割线以及剧情介绍(8分钟)
* s8 E v* L4 |6 C' _ 构建剧照与演职人员数据列表(10分钟)
# W; y- F' j4 Q, N5 \- V( [ 渲染剧照列表(8分钟)3 ~2 X% d6 k8 u* H& k) ], N1 T* _
双拼数组构建演职人员列表(12分钟), \* F) z6 M8 Q& q5 @
渐进式导航栏设置(6分钟)
5 ?& c/ J8 M# o, G9 e1 R; C 通过预览api实现剧照预览(7分钟)
& [6 y7 g# d! B2 i+ B8 l 演职人员数组拼接预览(8分钟)4 O2 r1 Z2 W" ~6 |5 U
13电影详情页构建 W% L, ^1 `# v S4 P
自定义预览封面图(13分钟)
% [% @3 d0 r& \" N2 S& `7 x actionSheet接口api使用(6分钟)
6 K1 I. u) S4 {9 T: i3 [ 下载以及保存图片(15分钟)1 k% k9 `# `" l: U- Q. [ X
配置https下载合法域名(5分钟)/ C3 b7 V$ C y/ H; [- v% Z( N
实现小程序中的分享转发功能(9分钟), @5 x) n) ]( U1 G
自定义导航栏按钮(11分钟)
0 X S, q2 z7 @, j( | 分享到朋友圈(9分钟)+ D9 ^5 E8 W% z( Z$ M
微信开放平台简单介绍(6分钟)
% q7 M9 l: l( {$ R' N 操作视频对象，提高用户体验(8分钟)9 T' i0 T* O2 U# j- ~
优化首页视频体验(13分钟)0 ~) B- x$ m6 ]* W& P
14我的页面（上）! h8 N( X3 g$ @3 k% V
开发个人页面-header与导航栏设置(9分钟)
2 z) J- |/ J! Y/ ?- ` 发个人页面-用户未登录和已登录的页面展示(9分钟)- }' B! \5 l! F7 e
构建注册登录页面(8分钟)
2 u5 M! Y# r4 x( W. b! ~2 [, E button与form组件讲解(6分钟)
+ a( {4 E9 I9 T/ O; u1 H" U5 U! \; R 实现一键注册登录(12分钟); G9 i- v O6 ~
通过缓存切换是否登录状态(9分钟), {, z9 ]" g! ^; [7 L
构建用户账号页面(9分钟)3 c: b2 T" {. d7 j" [1 i T
清理所有缓存api(4分钟)! k |% G/ ]' l( v+ a9 l
用户登录错误提示与方法挂载(7分钟)
& ~. f1 J; q2 c! g1 T! s 渲染用户信息数据(6分钟); d9 [! I: E" q+ x8 H
15我的页面（中）0 Z" t+ U8 `% c( T, v, J
用户退出登录(6分钟), V. n$ b1 f O0 g5 Y
第三方登录讲解与页面构建(16分钟)9 u: F$ y' B M* Z6 _, }
第三方登录-小程序端实现微信登录(15分钟)
/ ]7 k% p% B; ~! x; `# v* K( T 第三方登录-后端登录业务梳理（辅助理解）(10分钟)
: o- o* p) Y0 k8 [8 l" C6 c 第三方登录-app端授权登录(8分钟)+ }+ n, N! Z* a0 {# I
第三方登录-app端获取用户唯一id及信息(12分钟)( y j: m/ V; l0 ?7 l" [# a
第三方登录-app端执行一键注册登录(7分钟)
4 E4 ?; D7 U, } 查看预览用户头像(7分钟)
4 F! b2 c A% r* h) g2 i4 _ f 选择用户头像(11分钟)
2 \" |* N" [% j) j/ M1 ] 重新选择头像(3分钟)) f8 {* G9 q1 o/ V
16我的页面（下）
u2 I0 w2 P P: l/ E 文件上传api与后端接口讲解(5分钟)" m9 Y1 M% h3 P8 W+ N7 o
token令牌讲解、实现头像上传(23分钟)4 I4 I- n m! U3 L* P
引入图片剪裁实现头像上传(7分钟)7 R( ~# J0 x) g1 u
用户修改昵称(18分钟)
* u; U1 Y( m, r, k7 E' Q9 [6 b 用户修改生日(17分钟). T' D' j, e( o" p- F; i j
用户修改性别(15分钟)4 t) X1 o8 G* O9 s
17项目发布与上线& ~% @7 y* G) P8 @/ `
打包H5 web应用(5分钟)+ E( A! O% b4 n0 U: o
购买云服务与简介(6分钟)
. W `0 y1 Q: y1 Z' ^ 配置安全组，重置密码，上传nginx，配置ssh(14分钟)
8 P8 P5 n( `6 o% M; o4 }& f$ E 安装nginx(9分钟): S/ K# w+ r% w: B
成功发布H5端web应用(14分钟)
" d7 i) g. q& t+ I0 R1 } 微信小程序上传审核流程讲解(8分钟)
# K# l4 m! E8 @1 T' R 打包安卓apk(8分钟)
& w: p7 W, T }: @' T 简述ios打包(8分钟)
1 d1 Z3 M- [2 y# K18课程总结
. F. t7 P/ o" `& n2 m: P. d 课程总结与展望(9分钟)' l, |% ~; I8 q' x
2 g. i. u8 `# K, ?
5 J$ k- K7 E* E1 S
% Q8 a- e, `) ~, J d5 ~- E: m& S! l
|
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
