reactjs - スクロールイベントでリスト要素の終わりを検出する方法は?

Question

スクロールイベントでリスト要素の終わりを検出する方法は? 配列があるとしましょう[1,2,3,4,5,6,7,8,9,10]。スクロールがリストの最後に達したかどうかを検出し、値を返す必要があります(この場合、値は10です)? これが私のスニペットコードです: https://codesandbox.io/s/react-window-detect-last-element-on-scrolling-down-oo99p

Answer 1

親 div に onScroll イベントを使用できます。

const onScroll = (event) => {
  var element = event.target;
  if (element.scrollHeight - element.scrollTop === element.clientHeight)
  {
      console.log(dataArray[dataArray.length - 1]);
  }
} 

プレイグラウンドで参照してください: https://codesandbox.io/s/react-window-detect-last-element-on-scrolling-down-c4sv0?file=/src/index.js