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

Question

在useEffect函数中调用动作时，react-component会无限地重新渲染

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

这里我正在使用connect方法来分派动作（也尝试了钩子方式）。

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, …}