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) 
 
);