Se liga, eu comecei a fazer um app e precisava de um menu de cabeçalho pra a transição, seria esse um menu que é renderizado em toda página. Por isso ele foi criado e é ultilizado fora das . Por isso preciso ultilizar (segundo a documentação) o "WithRouter", porém por ser novo em react, estou tendo problemas pra entender a sintaxe antiga (que está na documentação) e não estou conseguindo adaptar para a nova versão.
Como eu faço o meu menu receber a capacidade de roteamento?
//Menu que precisa das rotas
export default function MenuBar() {
return(
<DropdownButton title={title} id="bg-nested-dropdown">
<Dropdown.Item as="button" eventKey="1">
Home
</Dropdown.Item>
<Dropdown.Item as="button" eventKey="2">
Sobre
</Dropdown.Item>
<Dropdown.Item as="button" eventKey="4">
Cadastro de Post
</Dropdown.Item>
<Dropdown.Divider />
</DropdownButton>
)};
//app.js do react
function App() {
return (
<div className="App">
<MenuBar></MenuBar>
<div className="container">
<Routes></Routes>
</div>
</div>
);
}
//documentação da API https://reacttraining.com/react-router/web/api/withRouter