Status kann nicht vom Redux-Speicher gelesen werden. Was habe ich verpasst?

Question

Hier ist meine index.js, wo ich zunächst eine Aktion versenden meiner Liste der Orte zu lesen:

import 'babel-polyfill'; 
import React from 'react'; 
import { render } from 'react-dom'; 
import configureStore from './store/configureStore'; 
import {Provider} from 'react-redux'; 
import { Router, browserHistory } from 'react-router'; 
import routes from './routes'; 
import {loadLocationList} from './actions/locationActions'; 
import './css/styles.css'; 

const store = configureStore(); 

render(
    <Provider store={store}> 
     <Router history={browserHistory} routes={routes} /> 
    </Provider>, 
    document.getElementById('app') 
); 

Dann hier ist meine Aktion, wo ich die Daten bekommen & dann eine Aktion aus ihm heraus erstellen:

export function loadLocationListSuccess(alistingData) { 
    return { type: types.LOAD_LOCATION_LIST_SUCCESS, listingData: alistingData}; 
} 

export function loadLocationList() { 
     return function(dispatch){ //we return a function that accepts a parameter, we just called it dispatch 
      //dispatch(fetchCallActions.fetchCallStart("")); // we dispatch a function fetchCallStart to indicate the start of our call, this is to keep in check with our asynchronous function calls 
      let link = 'http://example.com:8399/location';//our fetch url 
      console.log(link); //we log our link, just for debug purposes 

      return fetch(link) //start fetch 
      .then(function(response) { 
       return response.json(); 
      }).then(function(json) { 
       dispatch(loadLocationListSuccess(json)); 
      }).catch(function(ex) { 
       console.log('parsing failed', ex); 

      }); 
     }; 
    } 

hier ist dann mein Minderer:

import * as types from '../actions/actionTypes'; 

export default function locationReducer(state = [], action) { 
    switch(action.type) { 
     case types.LOAD_LOCATION_LIST_SUCCESS: 
      return {listingData: action.listingData}; 
     default: 
      return state; 
    } 
} 

hier Dann ist mein mapStateToProps & connect Funktion:

function mapStateToProps(state, ownProps) { 
     return { 
     // we'll call this in our component -> this.props.listingData 
     listingData: state.listingData 
     }; 
    } 

export default connect(mapStateToProps, mapDispatchToProps)(homePage); 

Aus irgendeinem Grund kann es nicht state.listingData gelesen oder bin ich es eigentlich falsch gemacht? Kann mir jemand bei diesem Problem helfen?

Ich versuchte state.listingData anmelden und es zeigte undefined

Hier ist meine configureStore:

import {createStore, applyMiddleware} from 'redux'; 
import rootReducer from '../reducers'; 
import reduxImmutableStateInvariant from 'redux-immutable-state-invariant'; 
import thunk from 'redux-thunk'; 

export default function configureStore(initialState) { 
    return createStore(
     rootReducer, 
     initialState, 
     applyMiddleware(thunk, reduxImmutableStateInvariant()) 
    ); 
} 

Hier mein kombiniert Reducer ist:

import {combineReducers} from 'redux'; 
import courses from './courseReducer'; 
import locations from './locationReducer'; 

const rootReducer = combineReducers({ 
    courses, 
    locations 
}); 


export default rootReducer; 

Habe ich schließen Sie es nicht in den Laden richtig ?

Letzte Aktualisierung: Logging JSON.stringify(state) in mapStateToProps würde tatsächlich zeigt das Ergebnis. Danke Leute.

Der gedrehte richtige Pfad state.locations.listingData zu sein, weil ich in meinem kombiniert Reducer ich denke, die Minderer enthalten als locations so vielleicht das ist, warum es der Staat state.locations ist. Hoffe das hilft jedem mit dem Problem.

Answer 1

• Können Sie den Code der configureStore-Datei anzeigen? Das Problem könnte dort sein, vielleicht haben Sie vergessen, Reducer zur Liste der Reducer hinzuzufügen.
• Funktioniert die Aktion richtig? Haben Sie Daten vor dispatch(loadLocationListSuccess(json)); protokolliert?

UPD:

Wegen rootReducer. Jeder Reduzierer erstellt seinen eigenen Schlüssel im Geschäft. Wenn Sie Ihre Reduzierungen in rootReducer kombinieren, wie:

import locations from './locationReducer'; 
const rootReducer = combineReducers({ 
    courses, 
    locations 
}); 

Es schafft Geschäft mit dieser Art von Struktur:

const store = { 
    courses: {}, 
    locations: {} 
} 

Also, nach, dass Sie Aktion ausgelöst und Minderer die Daten an diese geändert:

const store = { 
    courses: {}, 
    locations: { 
     listingData: someData 
    } 
} 

Wenn Sie auf listingData like: state zugreifen möchten.listingData, müssen Sie ein wenig ändern, um Ihre Minderer und combineReducer zu:

export default function listingData(state = {}, action) { 
    switch(action.type) { 
     case types.LOAD_LOCATION_LIST_SUCCESS: 
      return action.listingData; 
     default: 
      return state; 
    } 
} 

... 

import listingData from './locationReducer'; 
const rootReducer = combineReducers({ 
    courses, 
    listingData 
});