模板语法

vue中可以通过{{表达式}}来表示一个表达式

指令

1. v-text 用于显示文本

2. v-html 用于将html片段插入到目标位置，可能有不安全的问题

3. v-if 控制元素是否存在，如果为false，那么元素将被从DOM中移除

4. v-else v-if的链式调用块

5. v-else-if v-else-if的链式调用块

6. v-show 控制元素是否显示，元素仅隐藏而不是去掉

7. v-on 事件触发，可简写为@

8. v-bind 单向绑定，可简写为:

9. v-model 双向绑定

10. v-for 元素遍历（列表渲染）

事件修饰符

1. stop 阻止事件冒泡

2. prevent 阻止事件默认行为

3. self 仅在事件目标是当前元素时才会触发

4. once 事件仅触发一次

5. capture 事件将从包含此元素的顶层向下依次触发

6. passive 用于移动端，

7. native 让组件像html内置标签一样监听根元素的原生事件，比如@click

表单修饰符

1. lazy 仅在光标离开后触发

2. trim 过滤掉前后空格

3. number 将输入的值转为数值类型

鼠标修饰符

@click

1. left 针对鼠标左键触发

2. right 针对鼠标右键触发

3. middle 针对鼠标中键触发

键盘修饰符

@keyup/@keydown

可使用vue预定义的键名/键码或自定义名称

<!-- 键修饰符，键别名 -->
<input @keyup.enter="onEnter">
<!-- 键修饰符，键代码 -->
<input @keyup.13="onEnter">

自定义名称

Vue.config.keyCodes = {
  v: 86,
    f1: 112,
    // camelCase 不可用
    mediaPlayPause: 179,
    // 取而代之的是 kebab-case 且用双引号括起来
    "media-play-pause": 179,
    up: [38, 87]

  使用方式：
    <input type="text" @keyup.media-play-pause="method">

}