Utilizando useHistory no React

#react #hooks

Cuidado: Para utilizar o hook useHistory deve-se estar com o React atualizado pelo menos na versão 16.8.

O hook useHistory é bastante útil na programação React, pois permite ao programador acesso a uma instancia da navegação, fazendo com que seja possível acessar outras páginas da aplicação.
Um exemplo básico de uso do history está apresentado a seguir:

import React from 'react';
import { useHistory } from 'react-router-dom'; // import do hook

function Dogs(props) {
  const history = useHistory(); //chamado do hook

  const goToDogAdd = () => {
    history.push('/dogRegister'); //uso do hook para ir para a página /dogRegister
  };

  return (
    <button type="button" onClick={goToDogAdd}>
      Register a dog!
    </button>
  );
}

Uma atenção importante é que, assim como todos os hooks, o useHistory só pode ser chamado dentro de uma função.