reactjs - React-redux 动作被无限调用（无限循环）

Question

当在 useEffect 函数中调用 action 时，react-component 会无休止地重新渲染

  useEffect(() => {
    props.getApi('pages/websitepage/page_type/choices')
  },[])

在这里，我使用 connect 方法来调度动作（也尝试了 hooks 方式）。

export function getApi(url) {
    return dispatch => {
      Axios
        .get(
            BASE_URL + url ,{
                headers: header
            }
        )
        .then(response => {
          dispatch(fetchResponse(response.data.data));
        })
        .catch(error => {
          console.log(error)
        });
    };
  }

export const fetchResponse = (data) => {
  console.log('data',data);
    return{
        type: 'FETCH_RESPONSE',
        payload: data
    }
};

正如你在这里看到的，我正在调用动作调度来存储状态。但是组件不断重新渲染，我有什么可能的解决方案来阻止这种行为吗？在下面附加记录器响应

action FETCH_RESPONSE
    prev state {isAuthenticated: true, error: null, isLoading: false, currentBlogPage: 0, submitting: false, …}
    action     {type: "FETCH_RESPONSE", payload: Array(4)}
    next state {isAuthenticated: true, error: null, isLoading: false, currentBlogPage: 0, submitting: false, …}
action FETCH_RESPONSE
    prev state {isAuthenticated: true, error: null, isLoading: false, currentBlogPage: 0, submitting: false, …}
    action     {type: "FETCH_RESPONSE", payload: Array(4)}
    next state {isAuthenticated: true, error: null, isLoading: false, currentBlogPage: 0, submitting: false, …}
action FETCH_RESPONSE
    prev state {isAuthenticated: true, error: null, isLoading: false, currentBlogPage: 0, submitting: false, …}
    action     {type: "FETCH_RESPONSE", payload: Array(4)}
    next state {isAuthenticated: true, error: null, isLoading: false, currentBlogPage: 0, submitting: false, …}