Redux React从API创build初始状态

如何从API中定义initialState

操作

 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 } } 

减速

 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; 

reducers如果我这样定义了我的initialState ,它就起作用了:

 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", } ]), 

提前致谢。

在Redux根元素的componentWillMount (由Provider包装并接收存储的元素)中,可以调度fetchLentItems函数来设置初始状态。