React onWheel处理程序无法preventDefault，因为它是被动事件侦听器

文章/答案/技术大牛

发布

1回答

javascript、reactjs、dom、dom-events

我正在尝试覆盖组件上的Ctrl+scroll行为，但它不能处理错误[Intervention] Unable to preventDefault inside passive event listener我想我可以使用一个活动的监听器，那么有没有办法通过React来指定它呢？请注意，我需要访问和修改onWheel中的状态。const onWheel = (e: React.WheelEvent): void => { e.

浏览 213提问于2020-08-31得票数 0

1回答

在onWheel事件中使用event.preventDefault时，如何绕过reactjs中的“被动eventListeners”

reactjs、preventdefault、passive-event-listeners

我试图在onWheel事件中使用preventDefault，让用户在某些元素上滚动到边上，而不是向下滚动。当我使用e.preventDefault时，我一直收到错误消息:由于目标被视为被动，所以无法在被动事件侦听器内部进行干预。到目前为止，我似乎只找到了禁用错误消息的方法。调用函数的JSX： <Wrapper onWheel={(e) => (handleScroll(e))}> 调用e

浏览 57提问于2019-05-08得票数 1

1回答

将被动addEventListener替换为onTouchStart方法

reactjs、addeventlistener、passive-event-listeners、ontouchstart

document.addEventListener('touchstart', handler, {passive: true});换成onTouchStart={handler} console.log(event); 当我在假上有一个标志时 event.preventDefault仅仅是关于使用preventDefault()还是不使用？我理解得

浏览 4提问于2019-04-29得票数 1

3回答

如何将参数传递给自定义事件侦听器并防止reactjs中的默认值？

reactjs、event-handling、parameter-passing、preventdefault

我必须将一些参数传递给事件处理程序，并且需要防止默认事件。如何做到这一点？通过reactjs onMouseUp，我们可以传递参数，但现在由于被动事件不能阻止默认值(例如: event.preventDefault();)，但是对于自定义事件侦听器，我们可以防止默认事件，但不能传递参数this.mouseUpHandler, { });mouseUpHan

浏览 11提问于2020-10-26得票数 1

回答已采纳

1回答

如何停止div上的页面滚动

reactjs、svg

我试图使用e.preventDefault调用来停止这一点，但是我一直在被动事件侦听器调用中获得无法preventDefault的错误。我一直无法找到解决这一问题的办法。下面是代码减去SVG中的内容，因为它太适合在文章中使用。 export default function M

浏览 3提问于2021-06-20得票数 2

2回答

由于目标被视为被动的，所以无法在被动的Konva事件侦听器中进行preventDefault

javascript、dom-events、konvajs

我正在使用库(使用React@15.4.2和)来构建一个简单的2D游戏。由于目标被视为被动的，所以无法在被动事件侦听器中进行preventDefault此外，连接到Konva生成的画布元素的单击事件中没有一个在设备模式下工作。如果我退出了设备工

浏览 0提问于2017-02-13得票数 3

2回答

打字稿中的水平滚动

angular、typescript、mousewheel

我使用(wheel)事件来触发move()方法 <div> move(){ var el = document.querySelector('#tab-primary-wrapperel.addEventLis

浏览 3提问于2019-12-24得票数 0

2回答

无法preventDefault的owl-旋转木马

google-chrome、owl-carousel

猫头鹰旋转木马保存原木我使用的是OWL-Carousel2.2.0，它是

浏览 8提问于2017-02-25得票数 5

1回答

Jquery和Touch这么长的动作

javascript、jquery、mobile

当我点击按钮标签开关，如果在手指区域有按钮或链接-它是激活的

浏览 3提问于2017-05-08得票数 1

回答已采纳

6回答

在React中禁用`<input type=number>`上的滚动

javascript、reactjs、mousewheel

这个问题之前已经问过了，但提供的解决方案只适用于jQuery，因为我在ReactJs中也面临着同样的问题。是否可以禁用滚轮更改输入数字字段中的数字？我希望输入类型为number，因为它在移动/触摸设备上提供了数字键盘。

浏览 24提问于2020-08-03得票数 14

2回答

溢出时的React* - catch轮子事件:隐藏元素？*

reactjs

如果React组件中的元素有overflow:隐藏，我如何捕捉滚动/滚轮事件？<Component onWheel={this.handleWheel.bind(this)}/>

浏览 12提问于2016-08-18得票数 1

2回答

如何检查侦听器事件是否是被动事件？

javascript、dom、w3c、dom-events

我的库支持多个手势，设置多个侦听器，包括被动的和非被动的.库将确保最多只将一个真正的侦听器附加到DOM。因此，我们最多可以有2个touchstart侦听器，其中一个是被动的，另一个不是。我的问题和问题是，我无法检测一个接收到的事件是否附加了{ passive: true }选项。我认为可以在本机事件对象上使用cancelable属性，因为对被动事件调用preventDefa

浏览 0提问于2018-05-01得票数 6

回答已采纳

1回答

当鼠标超过一个特定的div时，防止页面滚动。

javascript、html、css、reactjs

当光标位于特定的div上时，我希望禁用mouseWheel事件上的页面滚动。div是一个放大mouseWheel事件的图形，由React组件呈现。我试过e.preventDefault，但是铬告诉我有人能帮忙吗？提前谢谢。

浏览 0提问于2019-04-04得票数 5

2回答

如何在svelte中向窗口事件/鼠标轮添加参数

javascript、svelte、svelte-3

现在，我只想记录事件并防止它发生： console.log(e); };<svelte:window on:wheel={handleWheel} /> 无法在被动事件侦听器调用中preventDefault

浏览 1提问于2020-02-02得票数 1

回答已采纳

2回答

将事件标记为显式而非被动事件

javascript、google-chrome、events

违规将非被动事件侦听器添加到滚动阻塞“轮子”事件中。考虑将事件处理程序标记为“被动”，以使页面更有响应性。是否有一种方法可以显式地将事件标记为非被动事件，并消除此警告？我知道这不会妨碍执行流程，但这是一种烦恼。我所能找到的就是如何标记它被动，但它是一

浏览 2提问于2017-06-07得票数 3

回答已采纳

1回答

Dblclick事件处理程序不响应apple设备

javascript、jquery、html、css

目前我的应用程序使用的是dblclick jquery插件，FancyTree事件并不只适用于苹果设备，当在iphone7/8上的google chrome开发者模式下运行时，它在控制台中显示以下错误:由于目标被视为被动目标，所以无法在被动事件侦听器内部执行preventDefault操作。来自插件中事件处理程序的代码 .on("click" + ns + "

浏览 30提问于2019-07-20得票数 0

2回答

无法阻止` window move`在iOS上滚动窗口

ios、scroll、mobile-safari、preventdefault、touchmove

我们正在尝试滚动iOS web应用程序上的元素，同时阻止窗口本身滚动。我们捕获窗口上的touchmove事件，以编程方式滚动元素，并(试图)通过在事件上调用preventDefault来阻止窗口本身滚动。不幸的是，这在Mobile Safari中不起作用。捕获touchforcestart并调用preventDefault似乎确实阻止了窗口的滚动，但我们在touchstart中调用它，这似乎“太晚了”，因为窗口仍在滚动。我们很困惑，因为这显然是一个错误，但它似乎已经修

浏览 6提问于2018-03-27得票数 34

回答已采纳

1回答

event.preventDefault不适用于Chrome中的"document“/ "document.body”元素

javascript、google-chrome、touch-event

我有一些功能可以防止设备上的触摸事件(在某些特定情况下)。在最后一次更新Chrome之前，它运行得很好。更新之后，试图阻止我从document或document.body获得的事件不再有效，但是如果我从某个特定元素侦听事件，它就会起作用。例如：document.addEventListener("touchmove", function(event) {document.querySel

浏览 2提问于2017-03-16得票数 3

2回答

React警告非被动事件侦听器对滚动阻止“touchstart”

javascript、reactjs、material-ui

我有一个带有material-ui Slider的react组件。每次此组件呈现时，我都会收到这样的警告：“已将非被动事件侦听器添加到滚动阻止'touchstart‘事件中。请考虑将事件处理程序标记为’被动‘，以使页面更具响应性。” 如何解决这个问题？ ?

浏览 91提问于2019-12-11得票数 3

2回答

角4-添加非被动事件侦听器到滚动阻塞‘鼠标轮’事件。

angular、google-chrome、event-listener、mousewheel

在“角4”项目中，当我单击日期选择器或选择选项菜单，在Google中运行它时，会收到以下警告：我在这里已经看到了堆栈溢出的一个问题，但是那个问题是关于‘触启动’的，而不是‘鼠标轮’。我真的不知道什么代码-我可以给你的例子，因为我不知道警告来自哪里。有人能帮我解决这个问题吗？

浏览 0提问于2018-06-22得票数 5

点击加载更多