"Cannot read property 'then' of undefined" 调度动作时

Question

根据 Redux 文档提供的 example，我已将我的 action creator 设置为：

export function createAlbumType(props) {
  return function (dispatch, getState) {
    dispatch({
      type: CREATE_ALBUM_TYPE_REQUEST,
    });

    axios.post(`${ALBUM_TYPES_URL}`, props).then(
      response => dispatch({
        type: CREATE_ALBUM_TYPE_SUCCESS,
        response,
      }),
      error => dispatch({
        type: CREATE_ALBUM_TYPE_FAILURE,
        error,
      })
    );
  };
}

成功保存我的相册类型后，我只想将用户重定向回索引页面。不幸的是，我在派遣后没有得到回报。根据我的代码，似乎是什么问题？我使用 redux-thunk 作为中间件，使用 react-redux-router 作为路由。

  onCreateSubmit(values) {
    const { dispatch } = this.props;

    return dispatch(createAlbumType(values))
      .then((action) => {
        if (action.type === 'CREATE_ALBUM_TYPE_SUCCESS') {
          dispatch(push('/album_types'));
        }
      });
  }

const store = createStore(reducers, {}, compose(
    applyMiddleware(
      routerMiddleware(browserHistory), 
      thunkMiddleware
    ),
    window.devToolsExtension ? window.devToolsExtension() : f => f
  )
);

const history = syncHistoryWithStore(browserHistory, store)

ReactDOM.render(
  <Provider store={ store } >
    <Router history={ history } routes={ routes } />
  </Provider>,
  document.getElementById('root')
);

Answer 1

redux 操作不是 return 承诺。您应该 return axios.post 函数。

export function createAlbumType(props) {
  return function (dispatch, getState) {
    dispatch({
      type: CREATE_ALBUM_TYPE_REQUEST,
    });

    return axios.post(`${ALBUM_TYPES_URL}`, props).then(
      response => dispatch({
        type: CREATE_ALBUM_TYPE_SUCCESS,
        response,
      }),
      error => dispatch({
        type: CREATE_ALBUM_TYPE_FAILURE,
        error,
      })
    );
  };
}

Answer 2

我建议不要这样做：

return dispatch(createAlbumType(values))
  .then((action) => {
    if (action.type === 'CREATE_ALBUM_TYPE_SUCCESS') {
      dispatch(push('/album_types'));
    }
  });
}

你在这里用这个 if (action.type) 重新发明了减速器。您应该从 createAlbumType 操作中发送，在 .post().then() 中。这样一切都包含在它应该在的地方。

"Cannot read property 'then' of undefined" 调度动作时

"Cannot read property 'then' of undefined" when dispatching action

javascript

reactjs

redux

redux-thunk