1回答

好帮手慕慕子

2020-07-07

已采纳

同学你好，passive表示不拦截默认事件， 具体可以参考如下解析理解：

1、先了解.prevent和.passive的区别

（1）prevent 是拦截默认事件。 老师举个简单的示例，帮助同学更好的理解，如下所示：

提交表单，默认会刷新页面，也就说下图所示代码，不添加修饰符，提交表单后，默认会刷新页面，

由于刷新了页面，控制台看不到输出的内容

添加.prevent后，会拦截默认事件，提交表单后，不会再执行默认行为（刷新页面）

可以在控制台看到输出的内容

（2）passive是不拦截默认事件。还是上面的例子，将修饰符改成passive，由于passive修饰符不会拦截默认事件，所以提交表单时会刷新页面，控制台没有内容

2、.passive并不会拦截默认事件，为什么还要使用它呢，这就涉及到涉及到浏览器解析比较底层的原理了，老师这里给同学解释下，同学简单了解下就可以了。

浏览器只有等内核线程执行到事件监听器对应的JavaScript代码时，才能知道内部是否会调用preventDefault函数来阻止事件的默认行为，所以浏览器本身是没有办法对这种场景进行优化的。这这样就会导致页面无法很快的响应用户操作，从而让用户感觉到页面有些卡顿。

通俗点说就是每次触发事件时，浏览器都会去查询一下是否有preventDefault阻止该次事件的默认动作。我们加上passive就是为了告诉浏览器，我们没有使用preventDefault阻止默认动作，不用查询了，可以大大提升用户体验感受。

3、从第一条分析可以看出这两个修饰符的作用刚好是相反的，一个是阻止默认事件，一个是不阻止默认事件，所以这个两个修饰符不可以同时使用的。

如果我的回答帮助到了你，欢迎采纳，祝学习愉快~

0

hq_勿忘初心_H

h 谢谢老师的讲解

h020-07-13

共1条回复