Vue

01-基础-系统指令-v-bind-绑定class-对象语法 <p :class=""{left : a , active :
b}">内容

data: {
a :true,
b:true
} 当a的值为true时类名left生效

02-基础-系统指令-v-bind-绑定class-数组语法

内容

data: {
a :‘left’,
b:‘foot’
}

03-基础-系统指令-v-bind-绑定style-对象语法 :style="{css属性名：data中的数据}"
:style="{color:b}" 在data中的数据b:‘red’

04-基础-系统指令-v-bind-绑定style-数组语法

内容

data: {
a {},
b:{}’
}

05-基础-系统指令-v-bind-切换class练习
@click=“isActive=!isActive”

06-基础-系统指令-v-model-语法糖原理 <input :value=“msg”
@input=“msg=$event.target.value”>
v-model其实是语法糖（简化语法） 双向数据绑定

07-基础-系统指令-v-model-绑定其他表单元素
1.多行文本输入框 textarea标签内容是无效的 ⒉.复选框
1.一个复选框v-model=“布尔”
2.多个复选框v-model=“同一个数组”
3.单选按钮radio 多个单选按钮绑定v-model="同一个数据”
4.下拉框seleEt+option
1.显示默认项v-model="select"和默认option的value值一致
2. select值是选中option对应value值

08-基础-系统指令v-cloak 场景{{}}闪烁问题
1.div#appv-block
2.style中[v-block]{disabled:none} 注意：v-cloak不需要赋值

09-基础-系统指令-v-once
场景：当标签只需要被渲染一次时
注意：不需要赋值

10-基础-表格案例-其他效果演示
1.自动获取焦点
2.日期格式处理

11-基础-过滤器-过滤器的文档分析
1.场景：当数据格式需要处理时（文本格式化）
2.分类：全局和局部（本地）
3.使用位置：{{msg|过滤器}}和v-bind:属性=“表达式|过滤器”

12-基础-过滤器-全局过滤器

1. Vue.filter(过滤器名字,(v)=>0)
   2.(V)=>{return 处理的结果}
   3.在视图中{{被处理的数据|过滤器的名字》} 注意: v参数自带的不需要手动传入

13-基础-过滤器-局部过滤器
1.通过选项filter定义过滤器filters:过滤器名字:function(v){}}
2.function(v)(return处理的结果}
3.在视图中(msg|过滤器名字}} 注意:选项filters 不要忘记s

14-基础-过滤器-传参数和串联使用
1.传参数{msg|过滤器名字(自己的参数)》
->(Ny)=>(y指的是自己传的参数}
2.串联{msg|过滤器A|过滤器B})
注意:过滤器B处理的是过滤器A所retrun的结果

15-基础-表格案例-使用过滤器完成曰期格式处理功能
moment(v).format(日期格式)

16-基础-ref操作DOM 场景：在vue操作dom元素
1.给要操作的元素设置ref属性值
2.在mounted{}（this.$refs.ref属性值.focus()}
注意：mounted是选项，不需要我们调用

17-基础-自定义指令-全局自定义指令
获取焦点->没有自带指令->自定义指令
1.Vue.directive(指令名，{inserted（el）{}）
2.inserted（el）{具体功能}
3.v-指令名
指令名不要加v- inserted(el){指的是使用该指令的dom元素}

18-基础-自定义指令-局部自定义指令
1.1.通过选项directives定义局部自定义指令
directives:{指令名:{inserted(el){}}
2. inserted(el){}
3.使用指令v指令名 注意:只能在该选项所在的vue实例所管理的视图中去使用

19-基础-表格案例-使用自定义指令完成自动获取焦点功能
ref操作dom和获取焦点自定义指令
没有必然的联系

20-基础-实例选项-计算属性-文档分析
场景:当数据A的逻辑很复杂时把A这个数据写在计算属性中
代码位置:通过选项computed:(计算属性a:值}
值:带有返回值retrun的函数
计算辰性a和data中的数据用法─样

21-基础-实例选项-计算属性-
基本使用 当计算机属性b依赖了data中的数据a时
当a变化时，b会自动变化

22-基础-实例选项-计算属性和methods区别
当计算机属性没有依赖了data数据时
会把第一次使用计算机属性return的结果进行缓存