Operaciones asincrónicas con redux-thunk
redux-thunk es una librería que nos permite realizar operaciones asincrónicas en nuestros action creators.
El primer paso es instalar la librería con npm o Yarn:
# npm
npm install --save redux-thunk
# yarn
yarn add redux-thunk
El siguiente paso es configurarlo en nuestro store:
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
// ...
const store = createStore(
reducer,
applyMiddleware(thunk)
);
Ahora debemos cambiar nuestros action creators para que retornen una función en vez de un objeto. Dentro de la función realizamos el llamado asincrónico e invocamos el
dispatch:const newTask = task => {
return dispatch => {
return axios.post("...", task)
.then(response => {
dispatch({
type: "NEW_TASK",
task: response
});
});
};
};
Eso es todo. La ventaja es que no es necesario cambiar nada en el resto de nuestro código.
Last modified 2mo ago