From the course: Building React and Django Apps

Unlock the full course today

Join today to access over 24,900 courses taught by industry experts.

Pagination with React

Pagination with React

- [Narrator] Let's create the react pagination component which will keep track of the current page index. How many items there are in total, number of items to display per page, and the next and previous page callbacks. We calculate the last page and whether or not there's a previous or a next button to display. Do the same for the next button and then we build out the components for the pagination component. We have the previous and the next button here, and then we display some stats about the page such as the current page number, the last page number, and how many items we're displaying per page. Then in the list component we import the pagination component. In the constructor of the list page we need to add the page index as part of the list page's state we need to keep track of the page index. Set it to one for the first page and then in the update list method, we're going to be passing that along to the…

Contents