0

所以我在 React 组件中创建了一个异步的动作调度链。我正在使用 Recompose,但在常规类组件中也发生了同样的事情:

import React from 'react';
import ....

const enhance = compose(
  connect(state, props => {
    return {
      store: state
    };
  }),
  withHandlers({
    doShit: props => event => {
      event.preventDefault();
      axiosGetApi(props.dispatch);
    }
  })
);

function axiosGetApi(dispatch) {
  dispatch({
    type: 'GET_DATA_API_REQ'
  });
  axios
    .get('api/getData')
    .then(response =>
      dispatch({
        type: 'GET_DATA_API_SUCCESS',
        payload: response.data
      })
    )
    .catch(error =>
      dispatch({
        type: 'GET_DATA_API_ERROR',
        payload: error.response.status
      })
    );
}

export const UniversalForm = enhance(({ dispatch, doShit }) => (
  <div>
    <button className="universalform" onClick={doShit}>Press
    </button>
    {console.log('RENDER')}
  </div>
));

问题是这样的——第一次按下按钮组件的渲染启动了六次,而在下一次按下时——两次。预计它只会在 Redux 存储的状态上渲染一次,并传递了一个新值。一度。Reducer 和 action 与 redux-actions lib 是一对一的。这是行为标准还是我做错了什么?

这是一个日志屏幕截图: 在此处输入图像描述

4

0 回答 0