function App() {
return (
<CustomContext.Provider>
<Header />
<Content />
<Footer />
</CustomContext.Provider>
);
}
function Content() {
const [ctxState, setCtxState] = useContext(CustomContext);
const routes = useRoutes();
useEffect(() => {
// something with routes
setCtxState({...})
}, [routes, setCtxState])
return <div>...</div>;
}
function Footer() {
return (
<div>
<CustomContext.Consumer>...</CustomContext.Consumer>