被动事件监听器中无法调用preventDefault的报错修复求助

报错原因 #

这个错误是因为浏览器将你的事件监听器设为了被动模式（passive），在这种模式下，浏览器禁止调用event.preventDefault()，目的是优化滚动这类高频事件的性能，避免页面卡顿。

修复方法 #

方法一：修改调用stop方法的方式

如果你能找到调用这个stop函数的地方，直接给第二个参数传true，这样就会跳过preventDefault()的执行，自然不会报错。
比如原来的调用代码是：

stop(event);

改成：

stop(event, true);

这样既保留了阻止事件冒泡的功能，又不会触发报错的代码逻辑。

方法二：修改stop方法本身（如果不能改调用方式）

直接修改你提供的stop函数，在调用preventDefault()之前，先判断事件是否允许取消默认行为（通过event.cancelable属性），只有允许的时候才执行该方法。修改后的代码如下：

/**
* Method: stop
* Stops an event from propagating.
*
* Parameters:
* event - {Event}
* allowDefault - {Boolean} If true, we stop the event chain but
*                               still allow the default browser
*                               behaviour (text selection, radio-button
*                               clicking, etc)
*                               Default false
*/

stop: function(event, allowDefault) {

        if (!allowDefault) { 
            if (event.preventDefault && event.cancelable) { // 新增event.cancelable判断
                event.preventDefault();
            } else if (!event.preventDefault) {
                event.returnValue = false;
            }
        }
                
        if (event.stopPropagation) {
            event.stopPropagation();
        } else {
            event.cancelBubble = true;
        }
    },

这段修改只是在原来的event.preventDefault判断后面加了&& event.cancelable，确保只有当事件可以取消默认行为时才调用preventDefault()，从根源避免报错。

内容的提问来源于stack exchange，提问作者Anna