@rt_s23

Как реализовать пагинацию на react?

Я сделал пагинацию, осталось задать ей нужное мне поведение, c этим вот и возникли вопросы.

628f82bd29f62082555011.jpeg
Вот как это должно выглядеть.

628f82d7610e4151602351.jpeg
А вот как это сделал я.

Код, где я отображаю пагинацию(лишнее, типо className убрал, что бы не засорять код):

{
        pages.map((page) => (
          <span
            role="button"
            tabIndex={0}
            onKeyPress={0}
            onClick={() => {
              dispatch(setCurrentPage(page));
              dispatch(paginatePaintings());
            }}
          >
            {page}
          </span>
        ))
      }


Вот как я высчитываю кол-во страниц:
[fetchPaintings.fulfilled]: (state, action) => {
      state.paintings = action.payload;
      for (let i = 0; i < Math.ceil(state.paintings.length / state.perPage); i += 1) {
        state.pages[i] = i + 1;
      }
    }
  • Вопрос задан
  • 59 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

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