在 React 生命周期方法中：doc.addEventListener('onmousemove', ... 不工作，但是 doc.onmousemove = ... 是。为什么？

Question

我确定这里遗漏了一些简单的东西，但我很困惑。

为什么 addEventListener 和 removeEventListener 函数在这些 React 生命周期方法中不起作用，但它们下面的注释行却起作用？

  componentDidMount(){
    document.addEventListener('onmousemove', this.handleMouseMove);
    // document.onmousemove = this.handleMouseMove;
  }

  componentWillUnmount(){
    document.removeEventListener('onmousemove', this.handleMouseMove);
    // document.onmousemove = null;
  }

  handleMouseMove(){ ... }

我可以只使用 document.onmousemove = ... 代码并且它有效。但是为什么上面的行不起作用？我觉得我在这里缺少一些基本的东西。

非常感谢任何帮助:)

Answer 1

事件名称是 mousemove，而不是 onmousemove。

onmousemove 是事件处理程序属性.

所以，正确的代码是：

document.addEventListener('mousemove', ...);
// OR
document.onmousemove = ...;

在 React 生命周期方法中：doc.addEventListener('onmousemove', ... 不工作，但是 doc.onmousemove = ... 是。为什么？

In react lifecycle methods: doc.addEventListener('onmousemove', ... not working, but doc.onmousemove = ... is. Why?

javascript

lifecycle

reactjs