Question

我是react and redux的新手。在这里，我试图根据userType将用户重定向到不同的页面。我拥有的是

我的main.js文件

class Main extends Component {

  componentDidMount() {
    this.props.isUserAuthenticated();
  }
  render() {
    return (
      <Router history={history}>
        <div>
          {this.props.isFetching && <Loading />}
          <Switch>
            <PrivateRoute exact path="/" component={LandingPage} />
            <PrivateRoute exact path="/create-job" component={NewJob} />
            <PrivateRoute exact path="/create-job/new" component={SelectCriteriaNewJob} />
            <PrivateRoute exact path="/view-job" component={ViewJob} />
            <PrivateRoute exact path="/resume-list/:jdId" component={ResumeList} />
            <PrivateRoute exact path="/DashBoard" component={DashBoard} />
            <Route exact path="/login" component={Login} />
            <Route exact path="/*" component={NotFound} something="foo" />
          </Switch>
        </div>
      </Router>
    )
  }
}

现在，存在登录操作。我将用户重定向到一页上，该页面根据我获得的数据决定将用户重定向到哪里。当前不是用户名逻辑。

在登录操作中，

  export function fetchToken(bodyjson) {
  return (dispatch) => {
    dispatch({
      type: LOGIN_REQUEST
    });
    let url = LOGIN_PATH + "username=" + bodyjson.userName + "&password=" + bodyjson.password;
    return post(url, bodyjson)
      .then((response) => {
        if (response.status === 200) {
          localStorage.setItem('user', bodyjson.username);
          localStorage.setItem('access_token', response.payload.access_token);
          history.push('/');
          dispatch({
            type: LOGIN_SUCCESS,
            data: response.payload,
          })
        }
        else {
          dispatch({
            type: LOGIN_FAILED,
            data: response.status,
          });
        }
      })
  }
}

现在，在此操作中，我将用户重定向到/页面，该页面上的组件看起来像

  render() {
        if (this.state.isloading) {
          return null;
        }
        else if (this.props.jobs) {
          return <JobList />;
        } else if (this.props.error) {
          return <ErrorComponent />
        }
        else {
          return <Redirect to="/create-job" />
        }
      }
    }

现在，当用户登录时，我得到一个令牌，即JWT令牌，该令牌具有一些信息。因此，如果用户类型为admin，我想在这里将用户重定向到/Dashboard页面。因此，可能会有差异角色，有什么办法可以做到这一点？

谢谢。

将用户重定向到其他页面取决于React中的userType

0 个答案: