The Context Consumer
The Consumer is a component that allows components to subscribe to a context. It lets you access the context value and use it within your component’s render function.
Consumers can be nested within each other to access multiple contexts if needed.
Javascript
// Consuming contextconst ChildComponent = () => { return ( <MyContext.Consumer> {value => <div>{value}</div>} </MyContext.Consumer> );}; |
What are Provider and Consumer in the Context API ?
Context API is a term that is created to pass as a global variable and can be accessed anywhere in the code. It is another way to pass props from child to parent i.e. known as “prop drilling“. It has two main components “The Context Provider ” and “The Context Consumer“.
Table of Content
- The Context Provider
- The Context Consumer
- How to create context API ?
- Conclusion