尝试从 React 路由器 v3 迁移到 v5，无法弄清楚身份验证后如何传递'props.children'和重定向

Question

项目使用redux集成，初始路线看起来像这样：

const userIsAuthenticated = connectedReduxRedirect({
redirectPath: `login`,
redirectAction: routerActions.replace,
wrapperDisplayName: 'UserIsAuthenticated'
});
const StandardAuthentication = userIsAuthenticated(
(props) => props.children
);

return(
<Provider store={store}>

<ConnectedRouter history={history}>
<Switch>
<Route
path='/register'
component={Register}
/>
<Route
path='/login'
render={() => (
<Login userManager={userManager} />
)}
/>
<Route
path='/callback'
render={() => (
<Callback userManager={userManager} />
)}
/>
//i am trying to change this part
<Route component={StandardAuthentication}>
<Route path="/" component={App}>
...many sub routes
</Route>
</Route>
<Route path="*" component={NotFoundExternal}/>
</Switch>
</Router>               

</Provider>)

我根据评论添加了以下内容，并从其他来源进行了一些修改：

const AuthenticationRoute = ({ component:Component, ...rest}) => {
return (
<Route
{...rest}
render={(props) => {
<StandardAuthentication>
<Component {...props} />
</StandardAuthentication>;
}}
/>
);
};

路线为：

<AuthenticationRoute path="/" component={App}/> 

并将子路由移动到App

它似乎不起作用。

它一直到回调页面，并且不转到"身份验证"路由或应用程序；NotFound"；路线有人能指导我如何解决这个问题吗？

提前感谢

Answer 1

我不确定，但可能会成功。您没有正确调用组件：

const AuthenticationRoute = ({ component:Component, ...rest}) => {
return (
<Route
{...rest}
render={props => <StandardAuthentication {...props}/>
}
/>
);
};