反应导航Redux的错误this.props.navigation.state.index不确定

Question

目前，我对工作的反应本地和我面临着反应，导航和终极版集成

我使用CREATE-反应，native-问题应用程序的应用程序

我收到以下错误。

我看过这个https://github.com/react-community/react-navigation/issues/261，但我无法弄清楚设置中的确切问题。

请让我知道什么，我缺少的设置

我App.js

import React, { Component } from 'react'; 
import * as Expo from "expo"; 
import { Provider, connect } from 'react-redux'; 
import store from "./store"; 
import AppNavigator from './Navigation'; 
import { addNavigationHelpers } from 'react-navigation'; 

class Root extends React.Component { 
    render() { 
     return (
      <AppNavigator navigation={addNavigationHelpers({ 
       dispatch: this.props.dispatch, 
       state: this.props.nav, 
      })} /> 
     ); 
    } 
} 

const mapStateToProps = (state) => ({ 
    nav: state.nav 
}); 

const AppWithNavigationState = connect(mapStateToProps)(Root); 

export default class App extends Component { 

    constructor(props) { 
     super(props); 
     this.state = { isLoading: true}; 
    } 

    componentWillMount() { 
     this.loadFonts(); 
    } 

    async loadFonts() { 
     await Expo.Font.loadAsync({ 
      Roboto_medium: require("native-base/Fonts/Roboto_medium.ttf") 
     }); 
     this.setState({ isLoading: false }); 
    } 

    render() { 
     if (this.state.isLoading) { 
      return <Expo.AppLoading />; 
     } else 
      return (
       <Provider store={store}> 
        <AppWithNavigationState/> 
       </Provider> 
      ); 

    } 
} 

我Navigation.js

import Home from './components/user/Home'; 
import Auth from "./components/user/Auth"; 
import React from 'react'; 
import { StackNavigator } from 'react-navigation'; 

const AppNavigator = StackNavigator(
    { 
     Auth: { screen: Auth }, 
     Home: { screen: Home } 
    }, 
    { 
     initialRouteName: "Auth", 
     headerMode: "none" 
    } 
); 

const initialState = { 
    index: 0, 
    routes: [ 
     { key: 'Auth', routeName: 'Auth' }, 
    ], 
}; 

export const navReducer = (state = initialState, action) => { 
    const nextState = AppNavigator.router.getStateForAction(action, state); 
    return nextState || state; 
}; 

export default AppNavigator; 

我已经使用它在结合减速器，如

export default combineReducers({ 
    nav: navReducer, 

}); 

我不知道我在想什么。

Answer 1

试着改变你的Navigation.js为：

import Home from './components/user/Home'; 
import Auth from "./components/user/Auth"; 
import React from 'react'; 
import { StackNavigator } from 'react-navigation'; 

const AppNavigator = StackNavigator(
    { 
     Auth: { screen: Auth }, 
     Home: { screen: Home } 
    }, 
    { 
     initialRouteName: "Auth", 
     headerMode: "none" 
    } 
); 

const initialState = AppNavigator.router.getStateForAction(AppNavigator.router.getActionForPathAndParams('Auth')); 

export const navReducer = (state = initialState, action) => { 
    let nextState; 
    nextState = AppNavigator.router.getStateForAction(action, state); 
    return nextState || state; 
}; 

export default AppNavigator; 

而且，你是如何调度的行动？ PS：我在这里写了一篇文章，以获得平滑的缩放和反应导航集成，这可能会有所帮助。 React-Navigation and Redux