From the course: Building a GraphQL Project with React.js

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Creating the pagination interface

Creating the pagination interface

- [Instructor] All right, let's finish this application off by creating our navigation component. All right, so in apps, let's start by creating a new component. So, we'll make a new file in the source folder. We'll call it NavButtons.js, and we'll create this method here. It's going to receive some items. So, we're going to get start, end, next, previous, and we will use a method called onPage. So this is a method that will be triggered whenever we click on one of these buttons that we're going to be creating here. So now, this is going to return some JSX code. So, we'll put some bootstrap code here. We'll need to export this NavButtons. All right, all right, let's keep on going, and we'll need to create two buttons. Now, these buttons will only show up if either previous or next has values in them. So we'll say here, previous, and then we'll create a button here. So a margin in the X direction of one, button small,…

Contents