Estoy creando una aplicación con React, TS, Redux y Ducks ( https://github.com/erikras/ducks-modular-redux )
Tengo varias acciones y reductores ya construidos. Pero estoy encontrando algunos problemas con las acciones de publicación. Aquí les dejo el código como ejemplo:
export const getChallenges: ReduxActionCreator = () => async (dispatch, getState) => { try { const data = await ApiClient.get('/challenges'); console.log('get', data); dispatch({ type: types.GET_CHALLENGES_SUCCESS, payload: data.data, }); } catch (error) { console.log(error); } }; export const postChallenges: ReduxActionCreator = (body) => async (dispatch, getState) => { try { const data = await ApiClient.post('/challenges', body); console.log('post', data); dispatch({ type: types.ADD_CHALLENGE_SUCCESS, payload: data.data, }); } catch (error) { console.log(error); } };Por lo tanto, getChallenges funciona bien y ya lo rendericé en el navegador.
Por alguna razón, postChallenges ni siquiera se activa en las herramientas de desarrollo de Redux, ni siquiera me da un error.
Lo estoy llamando simplemente así:
const dispatch = useDispatch(); const handleSubmitForm = () => { dispatch(postChallenges(values)); push(Path.AddMissions); };Código APIClient
import axios from 'axios'; export const ApiClient = axios.create({ baseURL: 'https://thnk.gendesa.genit.com.ar/api/v1/', timeout: 20 * 1000, headers: { 'Content-Type': 'application/json', }, }); ApiClient.interceptors.response.use( (response) => response.data, (error) => Promise.reject(error), );¿Algunas ideas?
¡Gracias!
Gracias a todos por sus preguntas y sugerencias. Definitivamente revisaré la documentación de los patos para mejorar el código una vez que tenga tiempo.
En cuanto a la solución, fue tan simple:
Solo agregando el reductor de desafíos a la tienda.
const composeEnhancers = (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; const rootReducer = combineReducers({ assesments: assessmentsReducer, auth: authReducer, events: eventsReducer, elements: elementsReducer, challenges: challengesReducer, questions: questionsReducer, surveys: surveysReducer, missions: missionsReducer, }); export const store = createStore(rootReducer, composeEnhancers(applyMiddleware(thunk))); export type RootState = ReturnType<typeof store.getState>; export type AppDispatch = typeof store.dispatch;Gracias por tomarte tu tiempo para leer mi pregunta.
Amable,