Redux异步操作返回错误:操作必须是普通对象。使用自定义中间件进行异步操作

时间:2017-06-10 07:59:25

标签: redux react-redux redux-thunk

我正在与异步Redux(thunk)挣扎。我真的不明白我的异步操作错误以及我收到错误的原因:错误:操作必须是普通对象。使用自定义中间件进行异步操作。

export async function startLocalizationFetchingAsync(currentLocalizationState) {
  return (dispatch) => {

    let payload = {
      request: {
        sent:true,
      }
    };

    dispatch({
      type: "NEW_LOCALIZATION_REQUEST_SENT2",
      payload: payload,
    });

    return axios.get("http://freegeoip.net/json/"+currentLocalizationState.clientIP)

      .then(res => {


        res = res.data;

        var payload = {
          country: res.country_name||'',
        };

        dispatch({
          type: "NEW_LOCALIZATION",
          payload: payload,
        });


      })
      .catch(function (error) {
        console.log("Promise Rejected",error);

        dispatch({
          type: "NEW_LOCALIZATION_REQUEST_ERROR",
          payload: null,
        });

      });

  };
}

在index.js路由器中我有以下代码

async action({ next, store }) {
    // Execute each child route until one of them return the result
    const route = await next();

    await store.dispatch(startLocalizationFetchingAsync());

这会给我一个错误:

Error: Actions must be plain objects. Use custom middleware for async actions.
dispatch
webpack:///~/redux/es/createStore.js:153
http://myskyhub.ddns.net:3000/assets/client.js:9796:16
http://myskyhub.ddns.net:3000/assets/vendor.js:46309:16
Object.dispatch
webpack:///~/redux-thunk/lib/index.js:14
Object._callee$
webpack:///src/routes/index.js?a731:35
tryCatch
webpack:///~/regenerator-runtime/runtime.js:65
Generator.invoke
webpack:///~/regenerator-runtime/runtime.js:303
Generator.prototype.(anonymous
webpack:///~/regenerator-runtime/runtime.js:117
http://myskyhub.ddns.net:3000/assets/3.9645f2aeaa83c71f5539.hot-update.js:8:361

,而配置存储是以下

const middleware = [thunk.withExtraArgument(helpers), thunk.withExtraArgument(AsyncMiddleware)];

  let enhancer;

  if (__DEV__) {
    middleware.push(createLogger());
    //middleware.push(AsyncMiddleware());

    enhancer = compose(
      applyMiddleware(...middleware),
      devToolsExtension,
    );
  } else {
    enhancer = applyMiddleware(...middleware);
  }

  initialState.localization = defaultLocalization; //Location

  // See https://github.com/rackt/redux/releases/tag/v3.1.0
  const store = createStore(rootReducer, initialState, enhancer);

我做错了什么?我不理解redux-thunk ......

0 个答案:

没有答案