Подгрузка данный при помощи Аjax в React?

Question

[LEV19]

Например, у меня есть list.json, где есть 1000 пользователей(Имя+Фамилия)
Мне надо вывести на экран первые и чтобы при клике на кнопку 'показать еще 10-20-100' добавлялись данные, в какую сторону копать!??
Спасибо)

Answer 1

[Антон Спирин]

Пагинация

Answer 2

[Андрей Охотников]

Храни в стейте значение limit - это количество подгружаемых записей и offset - отступ от начала массива.
Например при загрузке компонента загружаешь limit записей от элемента offset. После загрузки меняешь offset на offset + limit. И при каждой подгрузке элементов повторяешь эту операцию

Comments

[LEV19]

Делаю первый раз, получилось так)

Так вообще приемлимо, cтрочки 41 и 26-31 ?

https://codesandbox.io/s/1yvr3386vq

[Андрей Охотников]

LEV19, нет, смысл в подгрузке в том чтобы загружать с сервера информацию по частям, а не всю сразу. Ты же сразу получаешь весь список. Нужно в didMount получить первых 10 элементов например, а затем при клике на кнопку догружать еще 10 следующих и добавлять в стейт