useOffsetPagination

Category

Utilities

Hook that defines the logic when pagination

import { useOffsetPagination } from '@siberiacancode/reactuse';

Usage

const { currentPage, currentPageSize, pageCount, isFirstPage, isLastPage, prev, next } = useOffsetPagination({ total: 100, pageSize: 10, page: 1, onPageChange: (page) => {}, onPageCountChange: (pageCount) => {}, onPageSizeChange: (pageSize) => {} });

Demo

source

Api

Parameters

Name	Type	Default	Note
options	UseOffsetPaginationOptions	-	- The options for the hook
options.total?	number	-	- The total number of items
options.pageSize?	number	-	- The number of items per page
options.initialPage?	number	-	- The current page
options.onPageChange?	({ page, pageSize }: { page: number; pageSize: number }) => void	-	- The callback function to be invoked when page changes
options.onPageCountChange?	({ page, pageSize }: { page: number; pageSize: number }) => void	-	- The callback function to be invoked when page count changes
options.onPageSizeChange?	({ page, pageSize }: { page: number; pageSize: number }) => void	-	- The callback function to be invoked when page size changes

Returns

UseOffsetPaginationReturn

Contributors

Source • Demo