尽管数据可用，但 redux 中的有效负载始终未定义

Question

我有一个 Next.js 应用程序，我在其中使用了 redux / redux saga。

虽然我从后端接收数据（因此我可以在浏览器的网络选项卡中看到有效负载），但它作为 undefined 发送到我的减速器。我认为这可能是由于负载类型，并将其设置为 any。尽管如此，它还是不想工作。

这是我的设置（以简化形式显示）：

actions.ts

export const getSomeStuff: ActionType<any> = (data: any) => ({
  type: actionTypes.GET_SOME_STUFF,
  payload: data,
});

export const getSomeStuffSuccess: ActionType<any> = (data: any) => ({
  type: actionTypes.GET_SOME_STUFF_SUCCESS,
  payload: data,
});

actionTypes.ts

export const actionTypes = {
  GET_SOME_STUFF: 'GET_SOME_STUFF',
  GET_SOME_STUFF_SUCCESS: 'GET_SOME_STUFF_SUCCESS',
};

reducers.ts

interface customInterface {
  list: any;
}

export const initialState: customInterface = {
  list: null,
};

function reducer(state = initialState, action: ReturnType<ActionType>) {
  switch (action.type) {
    case actionTypes.GET_SOME_STUFF_SUCCESS:
      return {
        list: action.payload,
      };
    default:
      return state;
  }
}

sagas.ts

function* getSomeStuffSaga(action: ReturnType<ActionType>) {
  try {
    const payload: any = yield call(api.getSomeStuff, action.payload);
    yield put(getSomeStuffSuccess(payload));
  } catch (error) {
    console.error(error);
  }
}

function* watchGetSomeStuffSaga() {
  yield takeLatest(actionTypes.GET_SOME_STUFF, getSomeStuffSaga);
}

export default function* sagas() {
  yield fork(watchGetSomeStuffSaga);
}

api调用

  getSomeStuff = (data: any) => {
    http.get(`my/custom/endpoint`) as Promise<any>;
  };

派遣

dispatch(getSomeStuff('someStringParametersPassed'));

我得到的简化负载（在浏览器网络选项卡中）

{
   "items": [
      {
         "id":"123456789",
         "stuff":{
            "generalStuff": {
               ...
            },
            "basicStuff": {
               ...
            }
         }
      },
   ]
}

Answer 1

我猜你只是忘了在 api 调用中 return:

getSomeStuff = (data: any) => {
      return http.get(`my/custom/endpoint`) as Promise<any>;
  };

:)

尽管数据可用，但 redux 中的有效负载始终未定义

Payload in redux is always undefined, although data is available

reactjs

typescript

redux

react-redux

redux-saga