所以我在 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 是一对一的。这是行为标准还是我做错了什么?