React使用redux的本地路由：錯誤：預計Reducer是一個函數

Question

我正在嘗試使Redux在React Native應用程序中處理我的路由狀態。我用來處理路由的組件是react-native-router-flux。

我收到的錯誤消息是「預計減速機是功能」。 Here is the full error.我一直有這個問題很長一段時間，不能解決這個問題。我理解越來越多的Redux概念，但現在我不得不尋求幫助。根據閱讀相同問題上的stackoverflow帖子，我發現它可能是一些導出/導入問題，但我和我的項目成員或我的高級開發人員都無法看到它。

現在，我有3個不同的類，包括我的路由器組件的最低設置。請記住，爲了簡單起見，我從我的主文件App.js創建了商店。

集裝箱/ App.js

import React, { Component } from 'react'; 
import { Provider, connect } from 'react-redux'; 
import { combineReducers, createStore, applyMiddleware, compose } from 'redux'; 
import routingReducer, { counter, userReducer } from './../Redux/Reducers'; 

const RouterWithRedux = connect()(NavigationRouter); 

// Combine Reducers 
const reducers = combineReducers({ 
    userReducer, 
    routingReducer, 
}); 

// create store... 
const middleware = [/* ...your middleware (i.e. thunk) */]; 
const store = compose(
    applyMiddleware(...middleware))(createStore)(reducers); 

export default class App extends Component { 
    render() { 

    return (
     <Provider store={store}> 
     <RouterWithRedux /> 
     </Provider> 
    ) 
    } 
} 

終極版/ Reducers.js

import { ActionConst } from 'react-native-router-flux'; 

const routingState= { 
    scene: [], 
}; 


const userState = { 
    users: [], 
} 

// The Routing Reducer 
export default function routingReducer(state = routingState, action = {}) { 
    switch (action.type) { 
     // focus action is dispatched when a new screen comes into focus 
     case ActionConst.FOCUS: 
      return Object.assign({}, state, { 
       scene: action.scene, 
      }); 

     // ...other actions 

     default: 
      return state; 
    } 
}; 

// The User Reducer 
export function userReducer(state = userState, action = {}) { 
    switch(action.type) { 
     case 'USER_LIST_SUCCESS': 
      return Object.assign({}, state, { 
       users: action.users 
      }); 
    } 
    return state; 
}; 

導航/ MyExportedRouter.js

import React from 'react' 
import { Router, Scene, Actions } from 'react-native-router-flux'; 
import { connect } from 'react-redux'; 

import SettingsContainer from './../Containers/SettingsContainer' 
import LoginWrapper from './../Containers/LoginWrapper' 

const myConnectedRouter = connect()(Router); 
// TODO: Define Scene keys as "ENUMS": loginScreen -> TO_LOGIN 
const scenes = Actions.create(
    <Scene key="root"> 
     <Scene initial key='TO_LOGIN' component={ LoginWrapper } title='LaunchScreen' hideNavBar /> 
     <Scene key='TO_SETTINGS_VIEW' component={ SettingsContainer } title='Monthly View' /> 
    </Scene> 
); 

class MyExportedRouter extends React.Component { 
    constructor(props) { 
     super(props);' 
    }; 

    render() { 
     return (
      <myConnectedRouter scenes={scenes} /> 
     ); 
    } 
} 

export default MyExportedRouter; 

而且記住，反應本地路由器-flux將「THE_KEY」作爲動作發送給Reducers.js中的reducer。這是通過例如一個按鈕onPress =「Actions.THE_KEY」。

Answer 1

您確定這是您創建一個redux商店的方式嗎？嘗試按照createStore docs中的示例聲明您的商店。

const store = createStore(
 
    reducers, 
 
    applyMiddleware(...middleware) 
 
);