Действие, вызываемое в ComponentDidMount, вызывается бесконечно

Question

Я новичок в реакции js, поэтому здесь я вызываю действие в componentDidMout, а затем оно идет по бесконечному циклу, снова и снова вызывая одно и то же действие.

Маршрутизация ->

render() {

      return (
        <div>
          <Router history={history}>
            <div>
              <Switch>
                 { this.props.isFetching && <Loading />  }
                <PrivateRoute exact path="/" component={LandingScreen} />
                <PrivateRoute exact path="/QuizSetupMain" component={QuizSetupMain} />
                <Route exact path="/login" component={LoginComponent} />
              </Switch>
            </div>
          </Router>
        </div>
      )
    }
  }
}

PrivateRoute ->

const PrivateRoute = ({ component: Component, isFetching, hasUserLogIn, path, ...rest }) => {
  hasUserLogIn =  localStorage.getItem("access_token");
  console.log("hasUserLogIn", hasUserLogIn);
  if(hasUserLogIn !== undefined && hasUserLogIn !== null) {
      hasUserLogIn = true;
  }  else {
      hasUserLogIn = false;
  }
  console.log("hasUserLogIn",hasUserLogIn);
  return hasUserLogIn ?
    (
      <Route
        {...rest}
        path={path}
        component={Component}
      />
    )
    :
    (
      <Redirect
        to={{
          pathname: "/login",
          state: { from: path }
        }}
      />
    )
};

Итак, здесь После успешного входа в систему я делаю,

history.push('/');
                    dispatch({
                        type: LOGIN_SUCCESS,
                        data: response.payload,
                    })  In the action of login.

Сейчас, на экране Приземления, что означает после маршрута /в этом компоненте я вызываю действие, которое выглядит как

componentDidMount() {
    this.props.fetchUserJd();
  }

, поэтому всякий раз, когда он переходит к этому / в то время, когда он вызывает этот метод, в действии

export function fetchUserJd() {
  return (dispatch) => {
    let url = FETCH_JD_ROOT_URL + page + "&" + size;
    dispatch({
      type:REQUEST_INITIATED
    })
    get(url)
      .then((response) => {
        if (response.status === 200) {
          dispatch({
            type: REQUEST_SUCCESSED,
          });
          dispatch({
            type: FETCHING_JOBDESCRIPTION_SUCCESS,
            data: response.payload,
          }
          )
        }

Я делаю сейчас,

static getDerivedStateFromProps(nextProps, prevState) {
    if (nextProps.hasuserLogin || localStorage.getItem("access_token")) {
      nextProps.fetchUserJd();
    }
  }

Итак, здесь я даже показываю загрузчику, что состояние меняется, но все равно он снова и снова вызывает запрос API.Я не понимаю, почему это снова вызывает тот же запрос.кто-нибудь может мне предложить?