|
|
uni-app是MVVM框架，所以我们会对MVVM思想做简单的介绍，随后通过一个示例来阐述MVVM与数据的双向绑定。那么在示例中我们会讲解页面路由、基本配置、生命周期、响应式像素upx、{{}}表达式、vue指令与数据绑定、事件、条件判断以及for循环列表渲染。
' B& r; J; l+ ^; u2 I" Y W课程目录：
0 c, o9 D) [$ N+ h2 V& G01导学$ q; V0 B: C7 E3 a; [3 S
导学(12分钟)
* S r7 ]) k% G$ E2 C 学前必看！补充课：接口调用参数补充(6分钟)
: k K9 r) X9 x8 y$ V 基础框架NextHelloWorld(rar，513.7KB)8 h: B% u9 ~, y, J& h$ l) b9 t" s) N
超英预告最新源码(rar，8.7MB); y% t9 G) O0 v8 F3 x( J4 ]9 O9 G8 h
linux工具与ngxin安装(rar，37.3MB)
/ [# l6 |9 j6 y7 b! O; U. H+ ] logo素材制作(rar，730.3KB)$ s, U" p6 Y2 V$ Y: n" L
02课程介绍% q% R) l& Q9 P$ B/ x* x9 _7 k
什么是 uni-app(4分钟)* h7 V, K, g2 F; }" s
为什么要使用 uni-app(8分钟)" w9 P. p, j- o" Q+ u* y
app多端发布效果展示(7分钟)5 r3 }5 G7 h p6 @ J$ h5 C' ~
使用HbuilderX在ios、安卓、H5进行真机调试(14分钟)% x1 T- m5 L3 w' F
微信、支付宝小程序开发工具调试(7分钟)8 g( ?2 v4 `% J' r' Z
在Mac上使用Simulator进行调试(5分钟)* C8 E/ t& c- H0 F
03框架基础-上3 k6 G$ m; x* q
简述MVC模式(9分钟)
; w. z. c' I$ Q 图说MVVM模式(5分钟)+ a" ^8 o5 k6 c) W
通过代码阐述MVVM与双向绑定(12分钟)
/ X2 S7 k: K5 B f# `9 | JSON对象和数组的渲染(4分钟)
9 E" q" H) N6 I9 @ 页面路由以及标题配置(11分钟)
5 w' z' Y( {& L, K% M! {1 p! t 宏观讲解项目配置文件(16分钟)0 J0 X+ j ~2 F" M
应用的生命周期(11分钟)
, {- i4 i2 K$ _ 页面的生命周期(14分钟)5 n" b5 m4 t2 W1 W8 V; m# w `9 y' d# {
固定像素px与响应式像素upx(12分钟)
; K) F& ~5 D# T4 C5 _, Z+ | 在页面里使用{{}}表达式(7分钟)
4 C5 p) x: K( D' R04框架基础-下/ [1 ~3 i2 ? ]6 ? D3 n5 s. E! c
v-bind指令对属性的数据绑定(7分钟)4 r- t4 A2 t6 B" P5 A+ E* l
事件基础(22分钟)
4 |6 n/ V+ P5 f; X 条件渲染 v-if与v-show(7分钟)
0 u) a+ h/ z5 h0 Q 条件渲染 三元运算(4分钟)2 v1 c6 Q. F$ a, E, d! C- `* g
列表渲染v-for的使用(13分钟)
0 T# H" H- h! W4 Y 指令key实现for循环的组件唯一性(12分钟)& I+ i. |0 t0 N0 k: L
嵌套循环的下标定义(4分钟). E6 U/ A& s+ _ d$ @4 Q+ Z4 d% _
条件编译 - 上(10分钟)
6 J$ t3 p0 a! B 条件编译 - 下(7分钟)9 k8 G. J+ d" s( R
05样式与flex布局-上: w$ m0 K, }% r: I
flex布局介绍与模型(8分钟)
( D6 ?; t |- S' [; f. W% ] flex-direction 元素的排列4种方向(10分钟)) S5 w1 J7 `+ Z( |/ U
导入外部css样式(4分钟)
; ~6 ]: Z- M4 l% @4 F flex-wrap 元素的换行(12分钟)4 x. f8 E2 b# D: m7 ^0 p+ P2 Q
justify-content 元素在主轴的对齐方式(14分钟)! v1 L. t/ S2 j2 r* B% e
align-items 元素在交叉轴的对齐方式(12分钟)
/ h' W. Z @; ?/ E) D06样式与flex布局-下3 |' }8 H7 l1 u8 h: O9 a
align-content 多轴线的对齐方式(13分钟)
/ ]; j L0 a0 x% S: E& ] flex成员项的属性 - order(4分钟)
1 O9 C& W+ c, i flex成员项的属性 - flex-grow(4分钟)9 {: |2 f9 x4 r5 J( s. B& l
flex成员项的属性 - flex-shrink(6分钟)
& I b$ ~1 \" R$ L0 c3 J" G flex成员项的属性 - flex-basis(4分钟)8 J4 g( |& o" A" _, U: b& C9 y
flex成员项的属性 - align-self(6分钟)
* @+ r8 w- ?) ^) |6 P07开发首页-上, I/ u/ t$ {; J4 n5 P5 b! T
创建项目，构建基础页面(8分钟) 免费试学
7 D5 u4 g5 q) h. { 构建tabbar(13分钟) 免费试学
+ u* T. s; Z. N' s, I1 {2 X 设置全局page，简述view组件(6分钟) 免费试学3 ]- ]3 l" N# ^5 v) y
使用轮播图组件(11分钟) 免费试学+ B2 A2 Q E/ j& E1 v
禁用原生导航栏达到页面全屏化(6分钟) 免费试学* `" n% u. m7 a$ V# ~
在线文档的使用(8分钟) 免费试学
8 y8 X+ G8 | ]2 w9 e, `' Q request网络请求api讲解(5分钟)3 J: w) m- `% a# A; }
uni.request动态获得轮播图数据(9分钟)- H( K* s: T% t% v- u# F8 n" }8 h
箭头函数 this 作用域(4分钟)
: d6 \9 |$ D1 P: g# X( c- n 渲染并且展示轮播图(5分钟)& _' W" o M& O8 Z( r( P" s( B2 R
08开发首页-中5 P6 S _/ O) S! n; q8 e
引入组件实现全局变量(7分钟)
' W; X: ?3 o c/ t3 ^ 使用挂载实现全局变量(4分钟)
d3 E3 A* w# b( k6 f( y 在手机端进行微信小程序真机预览(6分钟)' C9 y) F' b d9 R/ S5 Z) y7 O
微信小程序https使用事项(7分钟)
1 o7 T& \+ c7 q2 { 开发热门超英 - 标题(9分钟): [0 `+ L9 u3 w. a. D8 H% y' t
开发热门超英 - 简述scroll-view(4分钟)
3 G. C& N5 N& h* |: P3 e! c 开发热门超英-使用scroll-view实现横向滚动(3分钟)1 v+ F8 a/ e: G8 S
开发热门超英 - 海报与标题(8分钟)8 c2 B7 w0 {9 C. W
开发热门超英 - 评分(6分钟)$ J" d0 l! b2 V) E1 i8 ~
开发热门超英 - 动态渲染数据(8分钟)
% x" x4 n9 |% k09开发首页-下
7 X" [, \, e7 ?& R 开发自定义组件(7分钟)
! [/ S8 ~& H1 G; Y' w: g% q 父组件向自定义组件传入值(6分钟)& }* j& @6 \8 y! T2 T: k
完成评分自定义组件(22分钟)4 F; t( q: F/ b9 v3 t' P# R
视频组件video讲解(9分钟)2 e: U+ ?- ~/ H
获取预告片数据(3分钟)
: V) I6 C8 I1 X 动态渲染预告片(10分钟) Q$ V/ m9 D. R+ K
猜你喜欢 - flex布局嵌套编写(18分钟)
+ f @. [/ h3 G, h5 g8 {# B( Q% {) p 猜你喜欢 - 编写点赞css(7分钟)
3 ~$ W2 e2 U0 r H# w3 U& M 猜你喜欢 - 实现点赞动画效果(14分钟)
, j( K! b3 X% H9 ~: g2 X Q 猜你喜欢 - 还原动画(5分钟)
! k9 G* R/ K* I4 T! e( i/ @( i2 E$ A10开发首页-终
+ D8 m. B0 y0 w 猜你喜欢 - 动态渲染列表(6分钟)
& T ^2 B- \, y+ E& l 猜你喜欢 - 实现动画数组(7分钟)
/ M. v7 d' d& U9 a4 K8 q2 S 猜你喜欢 - 条件编译解决动画跨端兼容问题(4分钟)
5 F1 k9 K3 ]9 q) V5 q6 T 猜你喜欢 - 开启下拉刷新(5分钟)2 u1 W4 c4 v1 q: j; e# i3 a
猜你喜欢 - loading交互api(8分钟)
9 b# Y0 [" L1 N, h11构建搜索页-上
8 S$ n3 W, B! m2 U- k4 S5 }% w/ w, x 搜索页面 - 编写搜索栏(19分钟)
& O: z* H7 z& \: L, d. K1 `+ f+ t 搜索页面 - 编写预告片列表、搜索栏置顶(9分钟)
6 i* G6 \' n9 L# V+ U4 J L% ] 搜索页面 - 动态获取最新预告并且渲染(9分钟)
# E U3 C6 J x0 Y N 搜索页面 - 分页接口api讲解(4分钟)
z1 V; ~( B |7 D) j 搜索页面 - 搜索前置准备(6分钟)7 |: h7 H: g, E, D
搜索页面 - 执行搜索动态渲染(8分钟) T5 y6 D; u8 L' Z2 a1 X6 g
搜索页面 - 监听下拉实现分页功能(8分钟)- ~. g3 U. {4 s7 y, D
页面路由api与传参(13分钟)
6 e: f; }& ~( Y( p 页面跳转组件的使用(7分钟)! a; n& U l+ w/ ]. e' X6 h' Z
详情页 - 查询详情与视频渲染(8分钟)
: e+ _1 N v/ w( U& T8 V' Q7 L12构建搜索页-下
- G0 I+ Y' \" P, R" I" N! ] 构建预告片基本信息(16分钟)) K# u7 Q# x* d+ U5 @
构建评分快与阴影效果(15分钟)" \4 l2 @$ y! Y
解决错误数据绑定undefined(5分钟)6 m# f- C* {. T
编写分割线以及剧情介绍(8分钟). x K2 F3 ]5 c2 D# ^# w
构建剧照与演职人员数据列表(10分钟)" {% o. P9 k2 L' A. K! ]; {
渲染剧照列表(8分钟)
3 ]' k! V; _3 P) l# b: L+ f 双拼数组构建演职人员列表(12分钟)7 v4 ?3 d+ p2 U
渐进式导航栏设置(6分钟)
3 o6 x6 O1 j9 p 通过预览api实现剧照预览(7分钟) I8 ]* N! y" _0 Q8 T* G
演职人员数组拼接预览(8分钟)
) v7 ~8 x) v' `" J2 |13电影详情页构建
1 u6 l. r: w; ^' u" n 自定义预览封面图(13分钟)
" Q; s" E+ [3 |5 w+ i actionSheet接口api使用(6分钟)
3 R1 N, W6 {/ g& S0 E2 [ 下载以及保存图片(15分钟)0 b1 x* P: d1 A4 r( T8 B
配置https下载合法域名(5分钟)3 e( N! H2 E' W9 r8 F/ l
实现小程序中的分享转发功能(9分钟)' S8 e; j# e: a1 h% w8 A
自定义导航栏按钮(11分钟)
( E) C+ _& s0 O% i. T& w. t- R& x: n 分享到朋友圈(9分钟)( K1 o5 q: `. x7 n* q- A
微信开放平台简单介绍(6分钟)* ~, b& l6 l& Y' k' ~% r# G% r
操作视频对象，提高用户体验(8分钟)& P t4 J2 g" N
优化首页视频体验(13分钟)
( C' a' m4 P. t; S# S' N14我的页面（上）! R. I' C" g3 ^- s& d2 U& k+ j
开发个人页面-header与导航栏设置(9分钟)
$ l. H" j ]# K1 ~5 H0 a( J 发个人页面-用户未登录和已登录的页面展示(9分钟); e8 k/ X2 U( b, L6 b0 D
构建注册登录页面(8分钟)' T# z6 o9 Z. m T2 I8 }
button与form组件讲解(6分钟)& d% t' K4 Z# E/ [+ w9 h
实现一键注册登录(12分钟)1 d! V1 Y+ t6 L' V8 f5 w
通过缓存切换是否登录状态(9分钟)( P2 \0 P1 p8 A+ L: e+ T
构建用户账号页面(9分钟)+ H% _8 C7 h7 v( ^# `
清理所有缓存api(4分钟)
9 ?, |1 q: U% w( I* o( t. S 用户登录错误提示与方法挂载(7分钟)
( O3 S' U2 {$ ]5 B( K) E0 N 渲染用户信息数据(6分钟)
/ A/ V9 W8 i0 q' z1 B3 p! b4 R15我的页面（中）8 t7 a' Y+ g, S6 c' C8 s h
用户退出登录(6分钟)/ t, C2 F3 g: k4 a# f& `7 J
第三方登录讲解与页面构建(16分钟)
/ z9 ]: Y1 v3 h! }9 \+ B8 Z 第三方登录-小程序端实现微信登录(15分钟)
- K8 F w# A7 Z/ j! v2 l P- P 第三方登录-后端登录业务梳理（辅助理解）(10分钟)
1 x; V& m4 _% e! Z# S" ~ 第三方登录-app端授权登录(8分钟)
: l# u! h) K9 Y9 K: ], F 第三方登录-app端获取用户唯一id及信息(12分钟)% Q: e9 z4 q$ e
第三方登录-app端执行一键注册登录(7分钟)
/ \' {# l/ f9 c: V+ R' S; ` 查看预览用户头像(7分钟)# w$ L/ F+ Y, p3 T6 ^$ X
选择用户头像(11分钟)
C* G# N: [) G- m7 H: |9 w 重新选择头像(3分钟)6 i7 \5 e; O- w+ G; T
16我的页面（下）4 w6 m g/ l. t; X& I; C
文件上传api与后端接口讲解(5分钟)
; J; [( b0 N2 Q0 u# [/ ^2 L" _$ f, s token令牌讲解、实现头像上传(23分钟)# Z1 [. V, o( e3 _$ {$ h. X
引入图片剪裁实现头像上传(7分钟)' u8 N- N+ n8 C9 }2 {$ D2 ^
用户修改昵称(18分钟)
; \ t/ L5 d) B; P, o 用户修改生日(17分钟)
3 u4 R) `- g1 ~3 k8 f2 l1 \9 z 用户修改性别(15分钟)
2 H" s7 }+ x2 x/ @3 {7 g" b* E17项目发布与上线
6 C! O6 x* v8 m 打包H5 web应用(5分钟)$ p5 B, z9 A1 b: F
购买云服务与简介(6分钟); o; S* a0 ~1 a
配置安全组，重置密码，上传nginx，配置ssh(14分钟). m* p" z7 Y, W% c. [3 g
安装nginx(9分钟)1 V3 v/ I* o$ ^! v
成功发布H5端web应用(14分钟)
4 Y5 G2 p* n+ V. H3 g, X9 k) ~) r+ c 微信小程序上传审核流程讲解(8分钟)6 B8 }* C6 c+ N* U( k
打包安卓apk(8分钟)
6 k. Q; J9 \7 Y; ~. P& ^$ F6 h 简述ios打包(8分钟)
5 S' J `6 a V" {6 h, Q, e18课程总结! m& {) q4 Z$ y7 g4 G! ?+ l
课程总结与展望(9分钟)# r' X% M7 \2 X
1 }8 h9 w$ }( c9 S/ p
; i o! \' Z- u+ \2 Z1 o* v
# Q" I* H3 E0 _6 ` |
|
|手机版|小黑屋|paopaomj.COM
( 
渝ICP备18007172号|
渝公网安备50010502503914号 )
发表于 2019-12-10 09:48:24
