1、模板语法
插值语法
{{xxxx}}用在标签体中，也就是<>{{xxx}}</>
xxx是js表达式，有返回值，如num+1、Date.now()。不是js代码
指令语法
以v开头，用于解析标签，包括标签属性、标签体内容、绑定事件
v-on 当…发生时，省略为@
v-bind 单向绑定，data流向页面
2、数据绑定
v-model 双向绑定，但不是所有数据都可用，只能用在表单类元素上（输入类元素）input、select
v-model:value 可以简写为 v-model 因为它默认收集的就是value值
3、el和data的两种用法
el挂载
1、new vue时配置el属性
root里的代码是vue模板
new vue({el:"#root", data:......
})
log(vue) 带$的是给程序员用的，其余不是
2、先创建实例，随后指定挂载。vue里面的数据挂载到页面上
v.$mount("#root")
或
setTimeout(()=>{v.$mount("#root")
},1000)
data用法
1、对象式
data:{name:
}
2、函数式。到组件时，必用函数式。
data:function(){ 既是 data(){return{name:}
}
这里面的this是vue实例对象。若改为箭头函数，则是全局window。
箭头函数没有自己的this，找不到往外找。所以，由vue管理的函数不用箭头。
data:()=>{}
10、MVVM
M：model data中的数据
V：view 视图页面
VM：viewmodel vue实例对象
View(DOM)----->Dom listeners(Vue)----->Model(原生js对象)
View(DOM)<-----Data bindings(Vue)<-----Model(原生js对象)
11、数据代理
给对象添加属性
Object.defineProperty(person, 'age', {
(value, '18')
enumberable:true, 可枚举/遍历 object.keys()
wirterable:true, 可修改
configurable:true 可删除
})
例如：外部用number=18，定义对象的age属性
不用数据代理的话，number改变，age值不变；
用数据代理可以实现age值随之改变的功能。
Object.defineProperty(person, 'age', {get:function(){ 当有人读取该属性时，get函数就会被调用，返回值是age的值return number;}set(vale{需要 number=value})
})
通过一个对象代理对另一个对象属性的操作（读/写） getter setter
vm.name-----setter---->data.name------->页面刷新
但是怎么打印验证data.name已修改呢？vm._data.name 或者
let data =
new Vue(){data
}
vm._data ====data 发现是true
通过vm对象来代理data(即_data)中的属性，vm.name代理 vm.__data.name （页面呈现）
通过Object.defineProperty把data中的对象属性添加到vm上，便于书写。
只有data里才做事件代理，vm有相关的getter、setter，method没有
14、事件处理
可传参
showInfo(66, $event)
showInfo() 默认有 $event
$event.target.innerText
15、事件修饰符
1、prevent 阻止默认事件，比如跳转链接
2、stop 阻止事件冒泡
3、once 事件只触发一次
也可以 @click.stop.prevent 修饰符连续写
4、capture 使用事件的捕获机制
由外向内，，冒泡是由内向外
5、self 只有event.target是当前操作的元素时才触发事件
6、passive 事件的默认行为立即执行，无需等待事件回调执行完毕。
滚动条 scroll ，鼠标滚动轮+键盘， 本身就有passive功能
但是 @wheel，只鼠标滚动轮，先执行滚动条，再事件回调
16、键盘事件
keyup 键盘松开才执行
keydown 只按下键盘，就开始执行
9个常用的
@keyup.enter 回车tab 换行。特别需要keydown，不能keyup。tab本身有切换焦点的功能delete 删除，包括退格键，一样效果esc 退出up 上down 下left 左right 右space 空格
4个修饰符： shift、ctrl、alt、meta(win)
1、配合keydown使用，功能正常
2、配合keyup使用，按下修饰键的同时，再按下其他键，随后释放其他键，事件才被解决
@keyup.ctrl.y 只有ctrl+y才触发事件
其他的，如键盘上的 Caps Lock 写成 @keyup.caps-lock
也可以具体的keycode，不推荐
vue.config.keycodes.键名=键码 定制
)
