There is action created using createAsyncThunk and this method return a promise which is handled like this
export const action = createAsyncThunk(
'/fullfilment/update-content-preference',
async (data, { getState }, thunkAPI) => {
try {
const state = getState();
const authToken = state.auth.token;
const { selectedShipmentId: shipmentId } = state.fullfilment;
const obj = {
...data,
shipmentId
};
const response = await axios.post(
'/fullfilment/update-content-preference',
obj,
{ headers: { Authorization: `Bearer ${authToken}` } }
);
return response;
} catch (err) {
if (err.response) {
return thunkAPI.rejectWithValue({
err: err.response,
status: err.response.status
});
}
return thunkAPI.rejectWithValue({
err: 'Network Error'
});
}
}
);
and below are the promises are handled
[action.pending]: state => ({
...state,
loading: true
}),
[action.fulfilled]: (state, action) => ({
...state,
data: {
...state.data,
loading: false,
list: action.payload.data.list
message: action.payload.data.message
}
}),
[action.rejected]: (state, action) => ({
...state,
loading: false
error: action.payload.data.error
message: action.payload.data.message
})
pending resolved and rejected all working well but in rejected i am unable to fetch the data but where action is dispatching thunkApi with error i am getting data there why not in rejected promise. any help would be appreciated thanks
You pass err to rejected but you forgot use it.
error: action.payload.err.data.error
message: action.payload.err.data.message
And you are declare thunkAPI wrong way. Just update like this:
async (data, thunkAPI) => {
const { getState } = thunkAPI;
}