I am having a conflict on how I can access the API response.
I explain it better:
My action newProfile
is responsible for sending a request through my configuration of apiAction
(Detail...)
// actions.js
export function newProfile(data) {
return apiAction({
url: '/profile',
data,
onSuccess: ((response) => ({
type: NEWPROFILE,
payload: response.id
})),
label: LOADING,
});
}
Up to here everything is perfect, I can execute the action without problems from my component.
const act = props.newProfile(data); // act = undefined
My problem is that I need the one id
from the answer immediately since I have to do a history.push('/profile/' + act.id)
.
How can I make my onSuccess
return the response to my component and in turn send it to the reducer NEWPROFILE
.
UPDATE
I am using a custom middleware to handle my api, which produces an error when trying to create a promise
Error: Actions must be plain objects. Use custom middleware for async actions.
I leave the link to my basic github configuration
You can implement your
action creator
as a promise and use the middlewareredux-thunk
to resolve thedispatch
, so your code would look like this:And where you would run your
dispatch
as apromesa
, you can do the following:The JavaScript language is event-oriented, meaning that when you make a request, you won't be able to immediately get the results. Instead, you should pass a callback function to it in the arguments where you call the function
newProfile
.It would be:
When the attribute is called
onSuccess
, you'll call the functioncallback
by doing:...and in your code, you'll call the function and do something like this: