我遵循了这个很棒的教程，它是使用 redux 的带有三个选项卡的选项卡栏。一切都很好。现在我正在尝试将此选项卡栏嵌套在 Stack Navigator 中，但出现以下错误：
我是 Redux 的新手，真的找不到问题出在哪里。这是我的代码：
StackNav.js
import React from 'react';
import { connect } from 'react-redux';
import { addNavigationHelpers } from 'react-navigation';
import { RootNav } from './../navigationConfiguration';
const mapStateToProps = (state) => {
return { navigationState: state.nav };
};
class StackNav extends React.Component {
render() {
const { dispatch, navigationState } = this.props;
return (
<RootNav
navigation={
addNavigationHelpers({
dispatch,
state: navigationState,
})
}
/>
);
}
}
export default connect(mapStateToProps)(StackNav);
StackNav 的 navigationConfiguration.js
import { StackNavigator } from 'react-navigation';
import TabBarNavigation from './../tabBar/views/TabBarNavigation';
import Welcome from './../../Screens/Register/Welcome.js';
const routeConfiguration = {
Welcome: { screen: Welcome },
Home: { screen: TabBarNavigation },
};
const stackNavigatorConfiguration = {
initialRouteName: 'Welcome',
headerMode: 'screen',
navigationOptions: {
header: { visible: false }
}
};
export const RootNav = StackNavigator(routeConfiguration, stackNavigatorConfiguration);
减速机
import { combineReducers } from 'redux';
// Navigation
import { AppNavigator } from './../stackNav/navigationConfiguration';
import { NavigatorTabOne } from './../tabOne/navigationConfiguration';
import { NavigatorTabTwo } from './../tabTwo/navigationConfiguration';
import { NavigatorTabThree } from './../tabThree/navigationConfiguration';
export default combineReducers({
nav: (state, action) => AppNavigator.router.getStateForAction(action, state),
tabOne: (state, action) => NavigatorTabOne.router.getStateForAction(action, state),
tabTwo: (state, action) => NavigatorTabTwo.router.getStateForAction(action, state),
tabThree: (state, action) => NavigatorTabThree.router.getStateForAction(action, state),
});
我也试过用这个减速器代替导航：上面
import { AppNavigator } from './../stackNav/navigationConfiguration';
const initialState = AppNavigator.router.getStateForAction(AppNavigator.router.getActionForPathAndParams('Welcome'));
export const navReducer = (state = initialState, action) => {
const nextState = AppNavigator.router.getStateForAction(action, state);
return nextState || state;
};
应用程序的起点：
import React from 'react';
import {
AppRegistry,
Text
} from 'react-native';
import { Provider } from 'react-redux';
import StackNav from './../App/stackNav/views/StackNav';
import store from './store';
Text.defaultProps.allowFontScaling = false;
class App extends React.Component {
render() {
return (
<Provider store={store}>
<StackNav />
</Provider>
);
}
}
AppRegistry.registerComponent('MyApp', () => App);
我将不胜感激。提前谢谢你！
