0

我正在使用 React 路由器。我的 app.js 如下所示 -

<div className="App">
    <Router history={history}>
      <div>
        <Switch>
            <Route exact path="/">
              <HomePage history={history}/>
            </Route>
            <Route path="/dashboard">
              <LinkBoardPage />
            </Route>
            <Route>
              "404 Not Found"
              <a href="/dashboard">
                Click here to get back to the dashboard
              </a>
            </Route>
        </Switch>
      </div>
      </Router>
  </div>

在执行登录后的函数中,我想使用 history.push 重新路由到 /dashboard 页面,我的代码如下所示 -

const responseSuccessGoogle = (response) => {
    console.log("Successfully logged in");
    axios({
        method: "POST",
        url: "http://localhost:3001/api/googlelogin",
        data:{ tokenId: response.tokenId }
    }).then(async (response) => {
        await props.storeUser(response.data);
        console.log(response.data);
        console.log("Before - ", window.location.pathname);
        await props.history.push("/dashboard");
        console.log("After - ", window.location.pathname);
    });
}

但是,即使浏览器转到 uri,/dashboard 它也不会正确加载,而是加载 404 not found 。但是,当我刷新页面时,它会正确路由并加载仪表板。

我的路由有什么遗漏吗?

responseSuccessGoogle 在这里被调用 -

return (
    <div className="LoginBox"><br />
        <div className="FormTitle"><h3>Login</h3></div><br />
        <div className="LoginButton">
            <GoogleLogin
                clientId="somerandomclientid"
                buttonText="Login with Google"
                onSuccess={responseSuccessGoogle}
                onFailure={responseErrorGoogle}
                cookiePolicy={'single_host_origin'}
            />
        </div>       
    </div>   
);
4

0 回答 0