React Router,URL正在更改,但路由未更新组件

时间:2020-03-02 03:51:27

标签: reactjs react-router

我有一个路由器,该路由器具有两个路由和一些在这些路由之间切换的链接,但是当我单击“链接”时,它会更新URL,但不会更新组件。为什么要这样做?

这是我组件的return语句中的代码

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>
);

1 个答案:

答案 0 :(得分: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>
);