Как использовать React Router с компонентом в качестве страницы по умолчанию

Question

Я создаю веб-приложение со страницей входа в качестве страницы по умолчанию. Когда пользователь успешно входит в систему, я хочу направить пользователя к другому функциональному компоненту dashboard () .

Мое приложение. js выглядит следующим образом

function App() {
  return (
    <ThemeProvider theme={THEME}>
      <FirebaseContext.Consumer>
        {firebase => <SignIn firebase={firebase}/>}
      </FirebaseContext.Consumer>
    </ThemeProvider>
  );
}

export default App;

SignIn - это компонент, который содержит форму входа и действие для аутентификации пользователя.

export default function SignIn(props) {
   function signInUser(){
      \\Signs in a user, and redirects to Dashboard() component
   }
   return(...)
}

Как перенаправить пользователя из функции signInUser на другой компонент панель мониторинга () ?

Answer 1

Из документов вы можете использовать useHistory hook.

import { useHistory } from "react-router-dom";

let history = useHistory();
export default function SignIn(props) {
     function signInUser(){
        // logic here
        history.push("/dashboard") // which is your route to the Dashboard com
     }
     return(...)
}