vue修饰符
事件修饰符.prevent修饰符.stop修饰符.once修饰符prevent修饰符用于阻止默认的事件行为,相当于event.preventDefault(),比如一个标签默认为链接//可否添加fn方法链接
stop修饰符用于阻止事件传播,相当于event.stopPropagation()。元素触发事件后默认会产生事件冒泡。事件冒泡会导致当前元素被触发并向上传递给父元素,然后依次向外传递。如果外部元素存在同样的事件,点击按钮时也会触发,div的点击事件也会触发组合正确写法
修饰符
once修饰符用于设置事件只会被触发一次默认方法。您可能会问为什么默认设置这样的修饰符。这就是说说这个修饰符的初衷【浏览器只能知道在内核线程执行事件监听器对应的JavaScript代码时,是否会在内部调用preventDefault函数来阻止事件的默认行为,所以浏览器本身没有办法优化这个场景。在这种场景下,用户的手势事件无法快速产生,会导致页面无法快速执行滑动逻辑,从而让用户感觉页面卡住了。】说白了就是每次事件发生时,浏览器都会检查是否有preventDefault来阻止事件的默认动作。我们加上passive就是告诉浏览器不用查询了。我们不使用preventDefault来阻止默认操作。一般用在滚动监控,@scoll,@touchmove,因为在滚动监控过程中,每移动一个像素点都会产生一个事件,每次都使用内核线程查询防止,会导致滑动卡顿。我们通过passive跳过内核线程查询,可以大大提高滑动的流畅度。注意:被动和防止冲突,不能同时绑定一个监听器。self修饰符仅在event.target为当前元素本身时触发处理函数。
...