React 中的事件侦听器滚动不起作用

Question

我在这里重现了这个错误。 document.body.addEventListener("scroll",func) 不起作用。 我认为这可能与 React 的最新版本有关，因为在我使用较低版本之前它可以工作。 https://codesandbox.io/s/upbeat-zeh-rzpoxi?file=/src/App.js

Answer 1

import "./styles.css";
import React from "react";

export default function App() {
  const [number, setNumbers] = React.useState(
    new Array(100).fill(Math.floor(Math.random(1) * 10000))
  );

  const scrollFunc = (e) => {
    let a = e.target.scrollTop;
    console.log(a);
  };

  React.useEffect(() => {
    document.addEventListener("scroll", scrollFunc);
  }, []);

  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      {number.map((item, i) => {
        return <div key={i}>{item}</div>;
      })}
    </div>
  );
}

它应该是 document.addEventListner()