function App() {
  const [response, setResponse] = useState([]);
  const [page, setPage] = useState(10);
  // const [data, setData] = useState([]);
  const count = useRef();

  useEffect(() => {
    fetch(`https://jsonplaceholder.typicode.com/comments`)
      .then(response => response.json())
      .then(json => getTenDataFirst(json));
  }, []);

  function getTenDataFirst(data) {
    data.splice(page)
    setResponse(data)
  }

  const handelInfiniteScroll = async () => {
    console.log("scrollHeight" + count.current.scrollHeight);
    console.log("innerHeight" + count.current.innerHeight);
    console.log("scrollTop" + count.current.scrollTop);
  };

  return (
    <div className='container'>
      <div className='box' ref={count} onScroll={() => handelInfiniteScroll()}>
        {
          response?.length > 0 && response?.map((data) => {
            return (
              <div key={data['id']}>{data['name']}</div>
            )
          })
        }
      </div>
    </div>
  );
}

export default App;

在reactjs中使用json data实现无限滚动，但onscroll得到innerHeight undefined。有没有其他方法可以在reactjs中实现无限滚动而不使用第三方库或JavaScript语法