From the course: Building React and Django Apps

Unlock the full course today

Join today to access over 22,400 courses taught by industry experts or purchase this course individually.

Displaying a list of items with React

Displaying a list of items with React

From the course: Building React and Django Apps

Start my 1-month free trial

Displaying a list of items with React

- [Instructor] We want our list to display more than one item. So, let's create a new default exported component. The list component will be using the same context as other pages in our app, the AppContext. We set that with a static variable. In the constructor, we keep track of the list of items and the total number of items. Then, we update the list, which means, sending the retrieveList method in the service API and sending that HTTP request to the Django REST Framework endpoint. The data we receive contains results and the number of items. We set the state and update those. In the render method, we're going to use some of the app context for the tour package wishlist and we'll need the list data to display. Create a section and the data-testId will come in handy, later, when we write unit tests for this component. Then, for each item in the list, we use the Item component, where the key is a unique key. Route…

Contents