Obtendo Parâmetros Da URL Com React

Assim como expliquei neste post, o React nos permite fazer o mesmo de uma maneira extremamente simples
Podemos obter os parâmetros enviados pela URL usando o nosso querido props!

Vamos começar configurando a nossa rota, para informarmos qual vai ser a nossa variável em nossa URL:

Em nosso arquivo onde definimos a navegação das rotas de nossa aplicação, devemos adicionar uma variável, que configuramos usando :nomeVariavel
No exemplo abaixo, a nossa rota movie recebe uma variável chamada id:

<Route path="/movie/:id">
  <Movie />
</Route>

Desta forma, o React irá entender que precisamos passar alguma informação após a string movie!
Muito bem, feito isso podemos acessar então a nossa variável, no componente desta página!

Em nosso componente, precisamos ter acesso ao props e com ele, tudo já está disponível para usarmos!
Então, para acessarmos o parâmetro ID pela URL, podemos acessar da seguinte maneira:

const fetchMovieById = () => {
  // Usamos essa propriedade para acessar
  // a variável vinda pela URL!
  const movieId = props.match.params.id;
};

Temos acesso facilmente através de props.match.params e passamos o nome da variável que configuramos pela URL!