Estoy un poco en conflicto acerca de esto y parece que no encuentro respuesta. Tengo una rebanada con algunas acciones. Lo que quiero hacer es disparar una solicitud sin esperar su resultado (es una llamada de base de fuego que debe manejarse de manera optimista).
¿Cómo debo estructurar mi código en torno a este caso? No se debe considerar el uso createAsyncThunk porque no estoy esperando nada y no necesito actualizar ninguna variable local de requestStatus .
Esto es lo que tengo ahora mismo:
// Component.js (where I do the dispatch) useEffect(() => dispatch(updateCheckIn(payload)), []) // CheckInActions.js import { updateCheckInInDb } from "../../api/checkin" import { updateCheckInAction } from "../reducers" export const updateCheckIn = (update) => { updateCheckInInDb(update) // make API call return updateCheckInAction(update) // return actual reducer action } // CheckInReducer.js const checkInSlice = createSlice({ name: "checkIn", initialState: INITIAL_STATE, reducers: { updateCheckInAction(state, action) { return updateStateViaUpdateApi(state.data, action) }, }, }) export const { updateCheckInAction } = checkInSlice.actions export default checkInSlice Esto funciona, pero siento que es un poco incómodo (especialmente el nombre). Tendría que llamar a uno updateCheckInAction y al otro updateCheckIn . Soy un poco nuevo en el kit de herramientas de redux. ¿No hay una manera más elegante de hacer esto?
La respuesta más idiomática aquí sería escribir a mano un thunk que inicia la solicitud asíncrona y luego envía la acción simple:
export const updateCheckIn = (update) => { return (dispatch) => { // make API call updateCheckInInDb(update) // dispatch actual action to update state dispatch(updateCheckInAction(update)) } } // used as dispatch(updateCheckIn(123))Consulte https://redux.js.org/usage/writing-logic-thunks para obtener detalles sobre qué thunks son en general y cómo escribirlos.