Reactjs 在路由上使用渲染方法时，需要单击React Router链接两次

在网上搜索后，我找到了几个答案，但没有一个对我有帮助，我也无法找出我的问题所在

我有一个简单的身份验证流程：

App.js

  const App = ({ currentUser, checkUserSession }) => {
  useEffect(() => {
    checkUserSession();
  }, [checkUserSession ]);

  return (
    <div className="App">
      <Switch>
        <Route path="/homepage" component={HomePage} />
        <Route
          path="/"
          render={() =>
            currentUser ? <Redirect to="/homepage" /> : <SignInSignUpPage />
          }
        />
      </Switch>
    </div>
  );
};

const-App=（{currentUser，checkUserSession}）=>{
useffect（（）=>{
checkUserSession（）；
}，[checkUserSession]）；
返回(
当前用户？：
}
/>
);
};

主页

const HomePage = () => {
    return (
        <HomePageComponent/>
    );
};

export default withRouter(HomePage);

const主页=（）=>{
返回(
);
};
导出默认路由器（主页）；

主页组件

const HomePageComponent = ({ dispatch , history }) => {
  return (
        <div
          className="homepage-container--header-link"
          onClick={() => {
            dispatch(signOutStart());
            history.push('/')
          }}
        >
          {" "}
          Sign-Out
        </div>
  );
};

export default withRouter(connect()(HomePageComponent));

consthomepagecomponent=（{dispatch，history}）=>{
返回(
{
调度（signOutStart（））；
history.push（“/”）
}}
>
{" "}
注销
);
};
使用路由器导出默认值（connect（）（HomePageComponent））；

发生的情况是，react路由器的链接需要单击两次才能转到“/”路径

我可以看到分派操作实际上被调用了两次，但是路径更改是在第二次单击时发生的

---

Im还使用基于当前用户值的重定向，因此路由应该仅基于当前用户值进行更改（请参见App.js）

链接

，而

onClick

不能一起工作。你的第二种方法是可行的。你能用路由器发布完整的代码吗？没错，我的错。现在，我们真的需要手动更改路线吗？正如您所看到的，我正在使用currentUser选择器上的Redirect base，它使用signOutStart（）actionYes获取null。理想情况下，您不应该手动更改路由。我的难题是，在调用signOutStart（）操作时检查currentUser后，我得到null-这应该由App.js中的重定向逻辑处理并呈现SignInSignOutPage，我认为发生的情况是，当使用render with Redirect时，它仍然会使用旧的道具？