React Router, URL меняется, но маршрут не обновляет компонент

Question

У меня есть маршрутизатор, который имеет два маршрута и несколько ссылок для переключения между этими маршрутами, но когда я нажимаю на ссылку, он обновляет URL, но не компонент. Почему он это делает?

вот код в операторе возврата моего компонента

return (
  <div className="auth-form">
    <div className="auth-form__head">
      <Link to="login" className="auth-form__button">
        Login
      </Link>
      <Link to="register" className="auth-form__button">
        Register
      </Link>
    </div>
    <div className="auth-form__body">
      <Router>
        <Switch>
          <Route path="/auth/login" component={LoginPage} />
          <Route path="/auth/register" component={SignUpPage} />
          <Redirect to="login" />
        </Switch>
      </Router>
    </div>
  </div>
);

Answer 1

<Router> необходимо обернуть вокруг Маршрутов и ссылок, чтобы он работал правильно

return (
    <Router>
        <div className="auth-form">
            <div className="auth-form__head">
                <Link onClick={reRender} to="login" className="auth-form__button">Login</Link>
                <Link onClick={reRender} to="register" className="auth-form__button">Register</Link>
            </div>
            <div className="auth-form__body">

                    <Switch>
                        <Route path="/auth/login" component={LoginPage}/>
                        <Route path="/auth/register" component={SignUpPage}/>
                        <Redirect to="login"/>
                    </Switch>

            </div>
        </div>
    </Router>
);