consume-multiple-contexts
Utility for consuming multiple react contexts. Look at the example.
Why?
It's common to have multiple contexts in React ecosystems and you need consuming them together in your components. In new context API is way for that but you must repeat consumers for every component. It's maybe good for few component but for large applications is pain. The module consume-multiple-contexts try to solve that problem.
Installation
You can add the consume-multiple-contexts to your project using npm:
npm i consume-multiple-contexts --save
Usage
I use example from React documentation.
const ThemeContext = React;const UserContext = React; Component { const signedInUser theme = thisprops; return <ThemeContextProvider value=theme> <UserContextProvider value=signedInUser> <Layout /> </UserContextProvider> </ThemeContextProvider> ; } { return <div> <Sidebar /> <Content /> </div> ;} { return <ThemeContextConsumer> <UserContextConsumer> <ProfilePage user=user theme=theme /> </UserContextConsumer> </ThemeContextConsumer> ;} { return <ThemeContextConsumer> <UserContextConsumer> <ProfileSidebar user=user theme=theme /> </UserContextConsumer> </ThemeContextConsumer> ;}
If you use consume-multiple-contexts module you can write:
; const ThemeContext = React;const UserContext = React; const withContext = ; { return ;} { return ;}
Or if you like HOC you can write:
; const ThemeContext = React;const UserContext = React; const multipleContexts = ;const withContext = ; const Content = ;const Sidebar = ;