我正在使用专用路由器的概念来保护我的应用程序,但是在未设置某些内容的情况下也会进行重定向。
我收到以下代码中的错误:Maximum update depth exceeded
:
function PrivateRoute ({component: Component,...rest }) {
const stateFn = state => state.init;
const init = useSelector(stateFn)
const isInstalled = init.installationComplete;
const isUserStored = localStorage.getItem('user');
return (
<Route
render={props =>
isUserStored && isInstalled ? (
<Component {...props} {...rest} />
) : !isInstalled ? (
<Redirect
to={{
pathname: "/install",state: { from: props.location }
}}
/>
) : (
<Redirect to={{ pathname: '/login',state: { from: props.location } }} />
)
}
/>
);
}
我在做错什么导致了错误?为什么?
我在这里使用PrivateRoute:
class App extends React.Component<any,any> {
constructor(props) {
super(props);
const { dispatch } = this.props;
dispatch(initactions.loadInit());
history.listen((location,action) => {
// clear alert on location change
dispatch(alertactions.clear());
});
}
render() {
const { alert } = this.props;
return (
<React.Fragment>
<Helmet titleTemplate="%s | conductor" defaultTitle="conductor"/>
<StylesProvider injectFirst>
<MuiThemeProvider theme={theme[0]}>
<ThemeProvider theme={theme[0]}>
{alert.message &&
<Alert mb={4} severity={alert.type}>{alert.message}</Alert>
}
<Router history={history}>
<div>
<PrivateRoute component={HomePage} />
<Route path="/login" component={LoginPage} />
<Route path="/install" component={InstallationPage} />
</div>
</Router>
</ThemeProvider>
</MuiThemeProvider>
</StylesProvider>
</React.Fragment>
);
}
}