我有一段时间试图了解最好的方法来做到这一点,甚至在哪里处理这个重定向.

我找到了一个创建ProtectedRoute像这样设置的组件的例子

const ProtectedRoute = ({ component: Component, ...rest }) => {
  return (
    <Route {...rest} render={props => (rest.authenticatedUser ? (<Component {...props}/>) : (
      <Redirect to={{
        pathname: '/login',
        state: { from: props.location }
      }}/>
    )
    )}/>
  );
};

像这样使用

<ProtectedRoute path="/" component={HomePage} exact />

我redux-thunk用来确保我可以fetch在我的操作中使用异步请求,这些设置是这样的

操作

export const loginSuccess = (user = {}) => ({
  type: 'LOGIN_SUCCESS',
  user
});

...

export const login = ({ userPhone = '', userPass = '' } = {}) …