#javascript #reactjs #infinite-scroll #ref #intersection-observer
#javascript #reactjs #бесконечная прокрутка #ссылка #пересечение-наблюдатель
Вопрос:
Я пытаюсь создать бесконечную нумерацию страниц с прокруткой в React и использую IntersectionObserver JavaScript для добавления дополнительной загрузки div. В основном, когда пользователь прокручивает вниз до таблицы Loading... , появляется текст, и вызывается API для извлечения содержимого таблицы из серверной части. Проблема в том, что если я показываю Loading... текст без какого-либо условного отображения, то IntersectionObserver запускается правильно, но когда я добавляю условие для отображения Loading... текста, IntersectionObserver вообще не запускается.
Из серверного API я буду получать numberOfPages переменную, которая будет определять, сколько страниц / записей присутствует в БД, возвращаемый Loading... текст не должен появляться после того, как он достигнет последней страницы. Это то, что я пробовал до сих пор. Также попробовал один из блогов, в которых я обнаружил ссылку на блог.
Код Codesandbox: ссылка на код
Live: живая демонстрация здесь
Комментарии:
1. Я предлагаю вам использовать
react-intersection-observer. Это значительно упрощает вашу жизнь2. @jarivak, хорошо, я понял. но в вашем коде codesandbox я вижу, что загружаемый текст всегда существует, и наблюдатель запускается каждый раз, когда я прокручиваю вниз, поэтому я не понимаю вашей проблемы
3. Да, текст загрузки существует, и к этому тексту я прикрепил ссылку, которая запустит api пересечения, но в моем случае она не запускается, вы можете проверить консоль, для каждого триггера у меня зарегистрирован журнал консоли.