React Context
This is what the docs have to say about context…
Occasionally, you want to pass data through the component tree without having to pass the props down manually at every level. React’s “context” feature lets you do this.
Docs
A good use of context would be for passing state when using redux with react for example. It is not recommended for passing props and should be used sparingly.
Using context will make your code harder to understand because it makes the data flow less clear. It is similar to using global variables to pass state through your application.
Docs
Passing Props Manually
First lets take a look at passing props through the component tree manually…
Using Context
Now take a look at the same thing but this time using context…
Note that the example above is just for demonstration purposes and is not the recommended approach when simply passing props.
Do not use context to pass your model data through components. Threading your data through the tree explicitly is much easier to understand. Using context makes your components more coupled and less reusable, because they behave differently depending on where they’re rendered.
When not to use context