接收错误:初始化期间,Reducer [...]返回undefined

时间:2017-08-27 10:14:52

标签: reactjs react-native redux react-redux

所以我检查this question因为它看起来很相似。但这没有帮助。

版本:

react@16.0.0-alpha.12
react-native@0.47.2
react-redux@5.0.6
redux@3.7.2

结构:

|index.android.js
  |src
     |actions
        |peopleActions
        |peopleConst
     |reducers
        |index
        |reducers-people
     |components
        |configureStore

actions / peopleConst.js:

export const FETCHING_PEOPLE = 'FETCHING_PEOPLE'
export const FETCHING_PEOPLE_SUCCESS = 'FETCHING_PEOPLE_SUCCESS'
export const FETCHING_PEOPLE_FAILURE = 'FETCHING_PEOPLE_FAILURE'

actions / peopleActions.js:

import { 
         FETCHING_PEOPLE, 
         FETCHING_PEOPLE_SUCCESS, 
         FETCHING_PEOPLE_FAILURE } from './peopleConst'

export function fetchPeopleFromAPI() {
    return(dispatch) => {
        dispatch(getPeople())
        fetch('https://swapi.co/api/people/')
        .then(res => res.json())
        .then(json => dispatch(getPeopleSuccess(json.results)))
        .catch(err => dispatch(getPeopleFailure(err)))
    }
}

function getPeople(){
    return {
        type:FETCHING_PEOPLE
    }
}

function getPeopleSuccess(data){
    return {
        type:FETCHING_PEOPLE_SUCCESS,
        data
    }
}

function getPeopleFailure(){
    return {
        type:FETCHING_PEOPLE_FAILURE
    }
}

减速器/减速器 - 人:

import { 
        FETCHING_PEOPLE, 
        FETCHING_PEOPLE_SUCCESS, 
        FETCHING_PEOPLE_FAILURE } from '../actions/peopleConst'

const initialState = {
    people: [],
    isFetching: false,
    error: false
}

export default function peopleReducer(
    state = {                 // <= Also tried state={initialState}
            people: [],
            isFetching: false,
            error: false }, action) {
    switch(action.type) {
        case "FETCHING_PEOPLE":
          return {
            ...state,
            isFetching: true, 
            people: []
          }
        case "FETCHING_PEOPLE_SUCCESS":
          return {
            ...state,
            isFetching: false,
            people: action.data
          }
        case "FETCHING_PEOPLE_FAILURE":
          return {
            ...state,
            isFetching: false,
            error: true
          }
        defualt: 
          return state
    }
}

减速器/索引:

import { combineReducers } from 'redux';

import peopleReducer from './reducers-people';

const allReducers = combineReducers({
    people: peopleReducer
});

export default allReducers;

components / configureStore:

import { createStore, applyMiddleware } from 'redux'
import logger from 'redux-logger'
import thunk from 'redux-thunk';
import rootReducer from '../reducers'

const myLogger = (store) => (next) => (action) => {
  console.log("Logged Action: ", action);
  next(action);
}

const middleware = applyMiddleware(logger, thunk);

export default function configureStore(){
  let store = createStore(rootReducer, {}, middleware)
  return store
}

reducer没有空状态,并且在定义状态时预定义并使用initialState,如:

export default function peopleReducer(
        state = {                 // <= Also tried state={initialState}
                people: [],
                isFetching: false,
                error: false }, action) {

但它仍然失败了这个错误。我做错了什么?

enter image description here

0 个答案:

没有答案