javascript - example - Redux React crea el estado inicial de la API
redux saga (1)
En el componentWillMount
de su elemento raíz de Redux (el que envuelve Provider
y recibe el almacén) puede despachar la función fetchLentItems
para configurar su estado inicial.
¿Cómo se define initialState
desde API?
Comportamiento
import * as types from ''../constants/ActionTypes''
import jquery from ''jquery''
import { apiRoot } from ''../config.js''
import Immutable from ''immutable''
import Random from ''random-js''
export function fetchLentItemList() {
return function(dispatch) {
dispatch(fetchLentItems());
jquery.get(`${apiRoot}/api/v1/something/`)
.done((data) => {
dispatch(fetchLentItems("success", Immutable.fromJS(data)))
})
.fail(() => {
dispatch(fetchLentItems("error"))
})
}
}
export function fetchLentItems(status, locations = Immutable.List()) {
return { type: types.FETCH_LENT_ITEMS, status, locations }
}
Reductores
import * as types from ''../constants/ActionTypes''
import { combineReducers } from ''redux''
import Immutable from ''immutable''
const initialState = {
initialLentItems: [],
lentItems: []
}
function initialLentItems(state = initialState.initialLentItems, action) {
// return state
switch (action.type) {
case types.FETCH_LENT_ITEMS:
switch (action.status) {
case ''success'':
return {
initialLentItems: action.locations,
lentItems: []
}
case ''error'':
return {
initialLentItems: Immutable.List(),
lentItems: []
}
default:
return Object.assign({}, state, { isLoading: true })
}
default:
return state
}
}
const rootReducer = combineReducers({
initialLentItems
})
export default rootReducer;
En los reducers
si initialState
mi initialState
así, funciona:
initialLentItems: Immutable.fromJS([
{
"lent_item_id": 5648,
"vendor": "Vendor A",
"product": "Product A",
"variant": "Variant A",
},
{
"lent_item_id": 5648,
"vendor": "Vendor B",
"product": "Product B",
"variant": "Variant B",
}
]),
Gracias por adelantado.