>本节讲解的内容对前面的章节具有依赖性，如果看起来有困难，请先看本系列前面的章节 ## 一、js知识复习 在讲解事件监听修饰符之前，我们有必要来复习一些基础知识 ### 1.1.什么是事件冒泡与事件捕获？  事件冒泡和事件捕获是Dom事件传播的两种模式，默认是冒泡模式。 * 事件冒泡：事件从事件目标(target)开始，往上冒泡直到页面的最上一级标签。对于上面的例子，当我们点击div#child的时候，方法childMethod和parentMethod将先后被调用。 * 事件捕获：事件捕获模式与冒泡模式正好相反，事件从父元素向子元素传播。对于上面的例子，当我们点击div#parent的时候，方法parentMethod和childMethod将先后被调用。 ### 1.2 什么是html标签的默认行为？ * 比如：`<a>`标签的默认行为是，实现跳转 * 比如： `<input type="submit"/>`默认行为是提交表单 ## 二、学习事件监听的修饰符  * **子元素**加上stop修饰符号之后，点击子元素div，只有childMethod方法被触发，parentMethod方法不会被触发。  * **父元素**加上self修饰符之后，点击子元素div，只有childMethod方法被触发，parentMethod方法不会被触发。  * 加上prevent修饰符号之后，不会有a标签的默认跳转行为。而会调用childMethod方法。  * 修饰符号可以串联使用，`.stop.prevent`表示先阻止冒泡行为，后阻止a标签的默认跳转行为  ## 三、总结一下 * stop修饰符，可以阻止事件向上级标签的冒泡行为 * self修饰符，表示被该修饰符修饰的父元素不接收子元素的事件冒泡行为 * prevent修饰符，可以阻止一些html标签的默认行为，比如a标签 * enter修饰符（按键监听修饰符的一种），可以监听回车按键的操作。 * once修饰符，表示事件只可以被触发监听一次，以后再操作则无效。 * capture修饰符，表示开启事件传播的捕获模式，事件由父元素向子元素传播，较少用到 ## 四、深入了解按键监听修饰符 vue给我们定义好了一些常用的按键监听修饰符，如下： * `.enter` 监听回车键 * `.tab` 监听Tab键 * `.delete` (监听“删除”和“退格”键) * `.esc` 监听ESC键 * `.space` 监听空格键 * `.up` 监听"上"键 * `.down` 监听"下"键 * `.left` 监听"左"键 * `.right` 监听"右"键 如果我们觉得上面的键盘监听修饰符不够用，我们还可以自定义，如下定义监听F1按键 ~~~ // 可以使用 `v-on:keyup.f1` Vue.config.keyCodes.f1 = 112 ~~~ F1按键的键盘码是112。