試圖通過API調用來更新initialData

Question

我試圖用API調用更新我的應用程序的initialData。

我收到錯誤：（0，_configureStore2.default）不是函數。

這裏是我的反應/ Redux的設置，

// app.js 
import { Provider } from 'react-redux' 
import configureStore from './config/configureStore'; 

import AppNavigation from './navigation' 
import { eventsFetchData } from './actions/events' 

const store = configureStore(); 

// dispatch action to get array of events for app 
store.dispatch(eventsFetchData()); 

export default class App extends Component { 
    render() { 
    return (
     <Provider store={store}> 
     <AppNavigation /> 
     </Provider> 
    ); 
    } 
} 

我使用的是thunk讓我的事件數據：

export const eventsHasErrored = bool => ({ 
     type: 'EVENTS_HAS_ERRORED', 
     hasErrored: bool 
}) 

export const eventsIsLoading = bool => ({ 
     type: 'EVENTS_IS_LOADING', 
     isLoading: bool 
}) 

export const eventsFetchDataSuccess = events => ({ 
     type: 'EVENTS_FETCH_DATA_SUCCESS', 
     events 
}) 

export function eventsFetchData(url) { 
    return (dispatch) => { 
     dispatch(eventsIsLoading(true)); 
     fetch(url) 
      .then((response) => { 
       if (!response.ok) { 
        throw Error(response.statusText); 
       } 
       dispatch(eventsIsLoading(false)); 
       return response; 
      }) 
      .then((response) => response.json()) 
      .then((events) => dispatch(eventsFetchDataSuccess(items))) 
      .catch(() => dispatch(eventsHasErrored(true))); 
    }; 
} 

我的減速器是：

export function eventsHasErrored(state = false, action) { 
    switch (action.type) { 
     case 'EVENTS_HAS_ERRORED': 
      return action.hasErrored; 

     default: 
      return state; 
    } 
} 

export function eventsIsLoading(state = false, action) { 
    switch (action.type) { 
     case 'EVENTS_IS_LOADING': 
      return action.isLoading; 

     default: 
      return state; 
    } 
} 

export function events(state = [], action) { 
    switch (action.type) { 
     case 'EVENTS_FETCH_DATA_SUCCESS': 

       return { 
     ...state, 
     ...action.events, 
     }; 

     default: 
      return state; 
    } 
} 

export function calendarView(state = null, action) { 
    switch (action.type) { 
     case 'CALENDAR_VIEW': 
      return action.viewType; 

     default: 
      return state; 
    } 
} 

這是我的商店：

const initialState = { 
    eventsHasErrored: false, 
    eventsIsLoading: true, 
    events: [], 
    calendarView: 0 
}; 

const reduxLogger = createLogger(); 

const store = createStore(
    rootReducer, 
    initialState, 
    applyMiddleware(thunk, reduxPromise, reduxLogger) 
); 

export default store; 

如何從api調用中更新我的initialState？

Answer 1

嘗試：

// app.js 
import { Provider } from 'react-redux' 
import store from './config/configureStore'; 

import AppNavigation from './navigation' 
import { eventsFetchData } from './actions/events' 

// dispatch action to get array of events for app 
store.dispatch(eventsFetchData()); 

export default class App extends Component { 
    render() { 
    return (
     <Provider store={store}> 
     <AppNavigation /> 
     </Provider> 
    ); 
    } 
} 

那是因爲我看到你返回已創建存儲和這可以解釋的錯誤消息：

const store = createStore(
    rootReducer, 
    initialState, 
    applyMiddleware(thunk, reduxPromise, reduxLogger) 
); 

export default store;