React JS - Context API

  • Context API is an alternate of Props which provides a way to pass data through components.

  • The component sending data is called Provider and component receiving data is called Consumer.

  • Easy
Example 1 : Passing Data from ContextAPI1 to ContextAPI2

In the below example, ContextAPI1 is Provider and ContextAPI2 is Consumer.

ContextAPI1.js :

















ContextAPI2.js :


















Example 2 : Passing Data from ContextAPI1 to ContextAPI2 & ContextAPI3

In the below example, ContextAPI1 is Provider and ContextAPI2 & ContextAPI3 are Consumers.

ContextAPI1.js :

















ContextAPI2.js :















ContextAPI3.js :



Comments