From the course: React for Web Designers

Unlock this course with a free trial

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

Lifting state for data visibility

Lifting state for data visibility - React.js Tutorial

From the course: React for Web Designers

Lifting state for data visibility

- [Instructor] Now we have a status updater that can read messages from our little API and post new ones. But to see the new ones, we have to reload the page. In this video, we'll start fixing that problem using a very common task in React, lifting up state. We want to let this post form add to the list of status messages when it sends a new one to the API. React's data flow is one way, downhill only, from parents to children via props. These two components are siblings and they can't talk to each other directly. In order for both of them to be able to access the messages state, which is currently in the message list component, we need to lift it out of there, into their shared parent. During the planning phase, we'll often catch possible issues like this before we even start, but sometimes we don't and in the course of building a site, needs can change, so this is a very common exercise that's worth going through now. And it's not very strenuous exercise. So over here in hotel.js…

Contents