I am trying to learn to react and I have a problem in redux.
the code is the following.
import * as postActions from & # 39; ../../ redux / actions / postActions & # 39 ;;
PostForm class extends the component {
handleSubmit = (e) => {
this.props.getBooks ()
}
render () {
he came back (
Create publication
);
}
}
export by default connect (status => ({
... state posts,
}), {
... postActions,
}) (PostForm);
As you can see, when the form is submitted, this action is called.props.getBooks ().
The action is defined as follows.
import * as types of & # 39; ../ constants / actionTypes & # 39 ;;
export function getBooks (obj = {}) {
const api = types.API_URL_BOOKS;
return shipping => {
return shipping ({
Type: types.ACTION_BOOK_LIST,
promise: client => client.get (api) .then ((data) => {
return data;
}),
});
};
}
I am using axios to make api calls. The problem is that I do not get the response from the server in the reducer. The reducer is the following.
import * as types of & # 39; ../ constants / actionTypes & # 39 ;;
exporter of default function reducer (status = {}, action = {}) {
switch (action.type) {
Case types.ACTION_BOOK_LIST:
he came back {
...state,
books: action.result.data.response.books
};
default:
return status
}
}
In debugging, I found that the action has only the following
{write: "BOOK_LIST"}
After that, in the apiMiddlewareCreator (which is defined in clientMiddleware.js), I get the response from the server
apiMiddlewareCreator (client) function {
return ({dispatch, getState}) => next => action => {
if (typeof action === & # 39; function & # 39;) {
return action (send, getState, client);
}
const {promise, type, hideLoader, ... rest} = action;
yes (! promise) {
return next (action);
}
next ({... rest, type: `$ {type}`});
const actionPromise = promise (customer);
actionpromise
.then (result => {
scrubber
if (result.data.success === false) throws result.data.message;
if (result && result.data && result.data.response) {
switch (action.type) {
default:
//nothing
}
}
return next ({... rest, result, type: `$ {type} _SUCCESS`, originalType: type})
})
returns actionpromise;
};
}
reducers / index.js
import {combineReducers} from & # 39; redux & # 39 ;;
// import {routerReducer as routing} from & # 39; react-router-redux & # 39 ;;
import postReducer from & # 39; ./ postReducer & # 39 ;;
const appReducer = combineReducers ({
// routing,
Books: PostReducer,
});
const rootReducer = (state, action) => {
return appReducer (status, action)
};
default export rootReducer;
I need the data to be available in the reducer. That is, action.result.data.response.books must contain the server's response.
I'm not sure how to solve this problem.
Any help would be appreciated.