我有麻烦了解如何检测"mouse3"/鼠滚动按钮按下事件的使用作出反应的onMouseDown事件。
我使用的 onMouseDown 在一些元件：
<Menu.Item
icon={<DashboardOutlined style={{ fontSize: '21px' }} />}
onClick={onClickDash}
onMouseDown={handleEvent}
>
Dashboard
</Menu.Item>
然后handleEvent:
const handleEvent = (event) => {
if (event.type === 'mousedown') {
console.log('MOUSE DOWN', event);
} else {
console.log('MOUSE UP', event);
}
};
问题是，我不能找到一种方法检测的老鼠滚动按钮按下具体的说明。 我怎么可以探测？ 官方mozilla文件没有提供一个例子要么.
免责声明 在编写时我只是针对铬浏览器。
当用户滚动DOM 滚动 事件被触发，一个事件，这是建立成没有浏览器的默认。 反应都有它自己的方法， onScroll，可呼吁任何部分的滚动的事件是解雇。 使用这onScroll方法我们可以叫一个功能结果的用户滚动。
例；
<SomeComponent onScroll={someMeothod} />
作为与任何DOM事件，事件的目的是建立与特性，可以提供有用的信息有关的事件和元件所述事件是相关的。 一个滚动的事件是解雇的每一像素的用户滚动。 在这种情况下，我们仅关注标识时用户已经滚动到结束的父母件含有我们的内容。
增加一个 onScroll 方法要素包含的内容，其中要求一个功能分类：
<div className="content-container" onScroll={this.handleScroll}>
// Your content
</div>
然后创建的 handleScroll 功能处理的滚动的事件：
class MyComponent extends React.Component {
handleScroll = e => {
let element = e.target
if (element.scrollHeight - element.scrollTop === element.clientHeight) {
// do something at end of scroll
}
}
render() {
return (
<div className="content-container" onScroll={this.handleScroll}>
// Your content
</div>
)
}
}
让我们打破什么是发生在 handleScroll 方法使事情更清楚...
e- 这相当于事件本身。 它是一个对象，是通过浏览器与性有关的滚动活动我们的工作。
让元=e。目标- 这使我们能够找到元素，派遣事件的使用(e。目标)，并将其分配给可变的，我们可以使用其余的代码。
现在我们(我们的代码)知道这件正在滚动并且我们已经分配给可变我们的方法范围，我们可以访问的性质的元素鉴于通过浏览器和计算，如果用户已经滚动到结束。
元素。scrollHeight- 这是高度素的元件的内容，包括内容不可见的屏幕上由于css溢出。
元素。scrollTop- 的高度素，一个元件的内容是滚动的垂直。
元素。clientHeight- 的高度素的滚动的一部分元。
使用上述性质的，我们可以计算出，如果用户已经滚动到底的元素通过比较负面的总和 scrollHeight 和 scrollTop 的 clientHeight. 如果他们是相同的，用户已经滚动到底元。 通过包装这个 if 发言因此，我们可以确保我们的内的功能的，如果声明的范围只是时运行的用户已经滚动到结束的div和我们的 if 条件得到满足。