@Alex657913

Событие scroll всегда вызывается дважды, как устранить дублирование?

Приветствую. Пытаюсь реализовать инфинити скролл для сообщений чата. Массив сообщений загружается в div, для обратной хронологии используется flex-direction: column-reverse. При прокрутке вверх, как только ползунок попадает в верхнюю зону, срабатывает загрузка сообщений. Привожу фрагмент кода,
<div style={{ display: 'flex', flexDirection: 'column-reverse', height: '100%', overflow: 'auto', scrollbarWidth: 'thin' }}
           onScroll={(e) => {
                e?.stopPropagation();
                 let height = e.target?.scrollHeight + e.target?.scrollTop - window.innerHeight;
                 if (height < 50) {                         
                      alert(height);
                      //loadRows();                    
                }
           }}
    > 
   { msgs.map( ....) }
</div>

Сейчас в качестве примера вместо загрузки alert, StrictMode отключен. Событие onScroll при одном движении скролла срабатывает всегда 2 раза. Что может являться причиной?
  • Вопрос задан
  • 102 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы