This article will cover two topics:
- What is props drilling?
- How to sidestep props drilling
What is Props Drilling?
First, let’s recap what we know about the props concept. Props are the data we pass or can access, from the top-level components to any number of child components on our website. Take a look at this diagram:
Diagram 1.
Props drilling (also known as threading) is illustrated in Diagram 2:
Diagram 2.
Props drilling (threading) refers to the process of passing data from the parent component to the _exact _child component. But, in between, other components owning the props just to pass it down the chain.
So, what’s the link between props drilling and our data?
Well, Leo has been nominated 7 times for the Oscars, and he only won for his role in the movie “The Revenant.” However, in the React.js world, his name is the props you pass to more than one level even they don’t need it until it reaches the one where you use props in.
#programming #javascript #react #reactjs
