React ~ Hooks ~ React Context - rohit120582sharma/Documentation GitHub Wiki

Context is like state, but instead of being confined to a component, it is global to your application. It is application-level state.

Context allows you to create a wormhole where stuff goes in and a wormhole in a child component where that same data comes out and the stuff in the middle doesn't know it's there. For more details, plz refer React Context in class component.

useContext allows a functional component to use the context system and just pulls the data out when given a Context object as a parameter. It allows us to get rid of render props nesting, if we have multiple consumers.

import LocaleContext from './LocaleContext';

function Blog(props) {
    const {locale, toggleLocale} = React.useContext(LocaleContext);
    
    return (
        <Posts locale={locale} />
    );
}