基本使用
引入vue
创建vue实例并关联容器
一个Vue实例只应对应一个容器
一个Vue实例可以有多个组件
模板语法
使用Vue实例中数据
root容器中代码被称为vue模板
语法分为插值语法和指令(v-xxx)
插值语法
绑定标签体内容
{{}}中的可以是js表达式（特殊的js代码）
表达式：一个表达式会生成一个值，放在需要值的地方
只需要改变Vue实例中的数据页面内容就会随之改变
指令
v-bind给标签属性绑定值
图中第一种方式会报错
第二种指令的方式会把双引号中内容当作表达式来处理
也可以简写为
v-model双向绑定
此时在下面的输入框输入内容，vue实例中i_value的值也发生变化
v-model指令只能用在表单类元素上，可以输入(有value)
简写形式
el与data的第二种写法
后面用到组件时，会用到函数式data
MVVM模型
数据代理
什么是数据代理：通过一个对象代理对另一个对象属性的操作
Object.defineProperties
为对象添加属性
将对象属性与变量关联
vue中的数据代理
vue对象和data对象关联
vue对象通过Object.defineProperties将data的属性加入到vue对象中，通过属性的getter，setter操作data中的值
点击会出现invoke property getter
点击即可调用message的getter获取到真正data对象中message的值
事件处理
v-on:click
提示：
vue中方法参数event代表事件状态，方法传参情况下需要在调用处用$event传递
vue中方法中this代表Vue对象
vue中的管理的方法最好不要写成箭头函数，否则在其中调用this就是windows对象了
事件修饰符
可以连用
键盘事件
keyCode指定具体的键 不推荐
给键指定别名
组合键
计算监听属性
计算属性
data中的key:value就是属性名，属性值
简写
方法简写
如果alert报错，说明Vue对象没有window的alert方法
监视属性
另一种写法
深度监视
简写
不用配置项(deep,immediate)时
绑定样式
class
style
条件渲染
列表渲染
也可以用来遍历字符串
key的作用
使用index为key
复用效率低，且会出现问题
使用元素唯一标识作key
总结
数据监测
