动态样式
- 作用：使用声明式变量来控制class和style的值
- 语法： ：class/：style
- 注意：尽可能不要把动态class和静态class一起使用，原因动态class起作用的时间会比较晚，需要通过Vue编译，会出现‘一闪而过’的效果。
动态class
- :class='由类名拼接而成的字符串""'字符串格式
- :class='[表达式1,表达式2,...]'数组格式
- 注意：每个表达式都要求返回一个已经定义过的class类
- :class='{"css类名1":布尔值，"css类名2":布尔值,...}'
- 注意：对象语法中，key名的返回值，若是变量需要加[],key名的返回是有效的类名，value必须是布尔值（小心布尔值的隐式类型转化）
- 注意：对象语法中，key名的返回值，若是变量需要加[],key名的返回是有效的类名，value必须是布尔值（小心布尔值的隐式类型转化）
动态style
- :style='ss' ss可以是html5中style值的字符串，还可以是[{},{}]数组语法，还可以直接是{css属性：css属性值}
- :style='[{},{}]'
- 注意：数组中的每个对象都是'css属性':css属性值 构成的对象
- ：style='{css属性:css属性值，...}'
表单绑定
- 表单：文本框，拾色器，多行文本框，下拉框，复选框，单选按钮组等...
- 从组件化的角度，凡是会发生值得的变化组件，都可以被认为是表单
- 注意：
- 1.在单/复选框时，给他们添加同一组v-model，就可以变成一组，同时需要添加：value用于双向绑定
- 2.一般多选框的v-model要设置一个类型为数组的声明式变量，但是我们提交给后端时，常常需要将其转化为以“；”，“#”分割的字符串，可以使用arr.join(";")方法
- 如何理解v-model这个指令
- 1.v-model是一种语法糖（一种比较好用的简写）
- 对于普通文本框来讲，v-model = v-bind：value + v-on：change
- 对于单选按钮组，复选框来讲，v-model =v-bind：checked + v-on：change
- 对于下拉框来讲，v-model = v-bind：value + v-on：change
- 2.v-model，在组件化中应用非常广泛，常用于父子组件通信
- 1.v-model是一种语法糖（一种比较好用的简写）
响应式
- 响应式？vue可以监听一个变量的变化，当变量发生变化时，vue可以做一些工作。当面试官问响应式的原理，是问什么呢？问的是“vue如何监听data选项上的变量的变化的？”
- 双向绑定？专指vue表单的v-model
模拟响应式实现过程
- 简介：1.首先创建vue实例，通过object.defineproperty设置拦截器
- 2.当使用v-text等指令操作时，会进行touch，定义一个dep收集依赖，存放与异步队列中
- 3.v-model，还可以设置值，相当于调用set方法
- 4.进行初始化，第一次渲染需要通知watcher观察者函数
- 5.定义观察者函数，当调用set修改声明式变量的值，发生变化时，会通知监听器，重新渲染，（即遍历收集依赖队列的所有fn，并执行）
