2015-12-04 18 views
10

APIからinitialStateを定義する方法は? reducersRedux ReactはAPIから初期状態を作成します

アクション

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; 

私はこのように私の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", 
    } 
    ]), 

ありがとうございます。

+0

あなたにとってはまったく機能しないものはありますか? –

+0

私が望むリストは返されません –

答えて

6

Reduxルート要素のcomponentWillMountProviderでラップされ、ストアを受け取る)では、fetchLentItemsファンクションをディスパッチして初期状態を設定できます。

関連する問題