Prop Drilling

What happens when the component that owns a piece of data and the component that displays it are several levels apart in the tree? A prop goes only from a parent to its direct child. So the data must be passed through every component in between, one level at a time, including components that never use it. Passing data down through components that only forward it is called prop drilling.

An Example of Prop Drilling

Consider an application where App knows the user's name, and a component three levels below it displays a welcome message. The component tree looks like this: