vue[关于修饰符的统一整理]

在vue中修饰符的主要目的是为了解决一些原生DOM事件中的一些细节问题以及一些常规的内容优化问题。因此了解修饰符在特定情况下的作用还是有必要的，这能提高不少的开发效率。

修饰符的类型

修饰符在不同的内容上有着不同的修饰作用，因此针对的内容也会有所不一样。

1.事件修饰符 6个

事件修饰符通常 应用于各种通用事件，如click、change等。常用的有：

1. .stop ------ 阻止事件冒泡
2. .prevent ------ 阻止默认事件(如表单提交、a标签跳转)
3. .capture ------ 与事件冒泡的方向相反，事件捕获由外到内
4. .self ------ 只会触发自己范围内的事件，不包含子元素
5. .once ------ 只会触发一次
6. .passive ------ 该修饰符表示事件设置{passive:true}，表示处理事件函数中不会调用preventDefault函数，就会减少了额外的监听，从而提高了性能；所以不能和.prevent修饰符一同使用，否则浏览器会报错

2.按键修饰符 9个

按键修饰符通常 应用在keyup/keypress/keydown等键盘按下事件
常用的有：

1. .enter------(通常用于输入内容时按下enter登录之类的内容)
2. .tab
3. .delete ------(捕获“删除”和“退格”键)
4. .esc
5. .space
6. .up
7. .down
8. .left
9. .right
   这些没什么好解释的，仅针对键盘对应的内容

3.系统修饰键 5个

系统修饰键通常 应用在鼠标或键盘事件的监听器 即click事件或者keyup之类的事件都可以用

1. .ctrl
2. .alt
3. .shift
4. .exact ------修饰符允许你控制由精确的系统修饰符组合触发的事件
5. .meta ------(这个键用的比较少，详情看官网)

4.鼠标按钮修饰符 3个

鼠标按钮修饰符 通常 应用在鼠标的事件上 即鼠标点击事件、滚动事件。

1. .left------左边触发
2. .right ------右边触发
3. .middle ------中间触发

5.通常修饰符 4个

这个修饰键通常应用在v-model这个指令上用于修饰一些变量

1. .lazy------ 在改变后才触发（也就是说只有光标离开input输入框的时候值才会改变）
2. .number ------ 将输出字符串转为Number类型·（虽然type类型定义了是number类型，但是如果输入字符串，输出的是string）
3. .trim ------ 自动过滤用户输入的首尾空格
4. .native ------ 绑定原生事件到组件模板的根节点上，针对一些自定义组件上的事件绑定操作，直接应用在html上是没效果的。

自定义按键修饰符别名

这个内容一般用的不多，但是有必要了解下

// 核心点在于Vue.config.keyCodes
Vue.config.keyCodes.f5 = 116;