在JS中管理路由的会话

Question

我有一个组件配置文件，我需要检查用户登录的条件。我像这样管理路由条件

<Route
  path="/profile"
  component={props =>
    this.state.userData.isLogin ? <ProfileSFW /> : <Redirect to="/sign-in" />
  }
/>;

但是当用户未登录并且页面重定向到注册页面时发生错误，我调用了调用Profile组件的API。即，

getCreatorSignupData() {
  let _that = this;
  _that.setState({ blocking: true });

  /***** fetch API for data starts **********/
  fetch(Constants.SERVER_URL + "/api/v1/become-creator/", {
    method: "GET",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
      Authorization: this.state.token
    }
  })
    .then(function(response) {
      let responseData = response.json();
      responseData.then(function(data) {
        if (data.status == 200 || data.status == 201) {
          _that.setState({ blocking: false });
          _that.setState({ creatorData: data.data });
        } else if (data.status == 204) {
          _that.setState({ blocking: false });
        } else {
          _that.setState({ blocking: false });
          Alert.error("<h4>" + Message.ERROR + "</h4>", {
            position: "top-right",
            effect: "slide",
            beep: false,
            timeout: 3000
          });
        }
      });
    })
    .catch(function(error) {
      _that.setState({ blocking: false });
      console.log("error", error);
    });

  /***** fetch API for data ends **********/
}

登陆登录屏幕时，显示此错误消息

Alert.error("<h4>" + Message.ERROR + "</h4>", {
  position: "top-right",
  effect: "slide",
  beep: false,
  timeout: 3000
});