我正在使用 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>
);