web前端：vue中的事件修饰符

作者:Thinkguo 更新于： 2020-03-12 20:21:25

　　修饰符是用于限定类型以及类型成员的声明的一种符号。

　　13种修饰符,按功能可分为三类:访问修饰符,类修饰符和成员修饰符.

　　1.stop

　　阻止事件冒泡

　　2.prevent

　　阻止默认事件发生

　　3.capture

　　当元素发生冒泡时，先触发带有该修饰符的元素。若有多个该修饰符，则由外而内触发。

　　4.passive

　　不拦截默认事件，每次事件产生，浏览器都会去查询一下是否有preventDefault阻止该次事件的默认动作。我们加上passive就是为了告诉浏览器，不用查询了，我们没用preventDefault阻止默认动作。

　　这里一般用在滚动监听，@scoll，@touchmove。因为滚动监听过程中，移动每个像素都会产生一次事件，每次都使用内核线程查询prevent会使滑动卡顿。我们通过passive将内核线程查询跳过，可以大大提升滑动的流畅度。

　　5.self

　　加了self元素的事件，只有自身触发才会执行回调，不执行冒泡过来的事件。

　　6.once

　　只触发一次回调

　　7.native

　　监听组件根元素的原生事件，在父组件中给子组件绑定一个原生的事件，不加'.native'事件是无法触发，可理解为把一个vue组件转化为一个普通的html标签，并且该修饰符对普通HTML标签是没有任何作用。

　　修饰符是用于限定类型以及类型成员的声明的一种符号。