路飞课程
"""
1、Vue框架:4~5天
vue框架概念
指令(重点)
成员变量(重点)
组件(核心)
生命周期钩子
vue项目开发+项目应用(重点)
2、drf框架:6天+
接口:restful接口规范
请求、响应、渲染、解析模块
序列化模块(核心)
三大认证模块(重点)
过滤、搜索、排序、分页、路由模块
3、路飞学城项目:6天
项目架构
git
短信认证
支付模块
前后台上线(服务器)
"""
Vue框架:官网
vue框架:渐进式JavaScript框架
vue一个环境:可以只控制页面中一个标签、可以控制一组标签、可以控制整个页面、可以控制整个项目
vue可以根据实际需求,选择控制前端项目的区域范围
为什么学习vue
"""
1、html、css、js直接开发项目,项目杂乱,不方便管理,要才有前端框架进行开发,规范项目
2、Angular、React、Vue三个前端框架,吸取前两个框架的所有优点,摒弃缺点,一手文档是中文
3、Vue框架优点:
轻量级
数据驱动
数据的双向绑定
虚拟DOM(嵌套页面架构的缓存)
组件化开发
由全球社区维护
单页面应用、MVVM设计模式
"""
知识点总结
"""
1、在html页面中用script标签导入vue环境
2、vue Vue({ el: "#app" })挂载页面标签,建立关联后控制页面标签
3、插值表达式{{ }}可以完成基础运算
4、插值表达式中的变量有实例成员 data 来提供
5、v-on指令可以给标签绑定事件,事件函数由实例成员 methods 来提供
6、插值表达式{{ 变量 | 过滤器 }}的过滤器由实例成员 filters 来提供
7、面向对象js: { 变量, } | function Fn(值){ this.属性 = 值 } | obj = { 方法(){} }
8、文本指令:{{ }} | v-text="" | v-html=""
9、事件指令: v-on:事件名="" | @事件名="" | :事件名="fn" | :事件名="fn($event, 自定义参数)"
10、属性指令:v-bind:属性名="" | :title="变量" | :style="字段变量" |
:class="变量" | :class="[变量1, 变量2]" | :class="{类1:真假, 类2:真假}"
"""
A作业(必做)
"""
1、按照上方 知识点总结 模块,总结今天所学知识点
2、有 红、黄、蓝 三个按钮,以及一个200x200矩形框box,点击不同的按钮,box的颜色会被切换为指定的颜色
3、有一个200x200矩形框wrap,点击wrap本身,记录点击次数,如果是1次wrap为pink色,2次wrap为green色,3次wrap为cyan色,4次重新回到pink色,依次类推
"""
B作业(选做)
"""
1、如图:图形初始左红右绿,点击一下后变成上红下绿,再点击变成右红左绿,再点击变成下红上绿,依次类推
2、可以将图编程自动旋转
"""