No curso de React Router, aprendemos que o código:
return (
<Router>
<Cabecalho />
<Switch>
<Route exact path='/'>
<Home />
</Route>
<Route path='/sobre'>
<Sobre />
</Route>
<Route>
<Pagina404 />
</Route>
</Switch>
</Router>vai redirecionar todas as rotas não especificadas para a última Route (que leva à página 404). Porém ao tentar utilizar isso com os context providers eu não consigo essa mesma funcionalidade:
- A página 404 é sempre exibida logo após qualquer renderização de rota (quando a rota da Page404 é colocada depois do switch - nesse caso até entendo ela ser renderizada - ou dentro dos contextos)
ou então:
//...
</Switch>
<Route>
<Page404 />
</Route>
</BrowserRouter>);}
//ou
//...
<Route path="/carrinho">
<Carrinho />
</Route>
<Route>
<Page404 />
</Route>
</PagamentoProvider>
</CarrinhoProvider>
</UsuarioProvider>
</Switch>
</BrowserRouter> );}
//ou
//...
</CarrinhoProvider>
<Route>
<Page404 />
</Route>
</UsuarioProvider>
</Switch>
</BrowserRouter> );}- Ou a Page 404 nunca é renderizada (se colocada entre o fechamento do último contexto e o fechamento do Switch)
//...
</PagamentoProvider>
</CarrinhoProvider>
</UsuarioProvider>
<Route>
<Page404 />
</Route>
</Switch>
</BrowserRouter> );}Então como utilizar os Contextos nessas situações? Ou como redirecionar as rotas que não dependem de contexto, como a Page404)?
É ok eu englobar o switch em todos os contextos? (nesse caso funciona, mas me parece um pouco sem sentido, já que todas as rotas têm acesso a todos os contextos)
