从底部导航反应本机更改屏幕

Question

我有2个屏幕；

1. 登录屏幕
2. 其中有2个标签的主屏幕。 （createbottomnavigation）

我想从主屏幕访问我的第三个屏幕，但出现错误：“未定义不是对象...”

这是我在app.js中的路线：

const Routes = createStackNavigator(
{
  Login: {
   screen: Login,

  navigationOptions: ({ navigation }) => ({
      header: null,
    }),

},
  Main: {
   screen: MainScreenRoutes,
   navigationOptions: ({navigation}) => ({
    header: null,
   }),
},
   MyProfil: {
    screen: MyProfile,
   }
},
{
  initialRouteName: 'Login',
  headerMode: 'screen',
  navigationOptions: {
   ...HeaderStyles,
   animationEnabled: true
  }
 }
);

我无法从我拥有标签的“主”屏幕中访问MyProfil。

主配置文件路由器：

let headerDefaultNavigationConfig = {
  header: props => <CustomHeader {...props} />,
  ...HeaderStyles
};

const Tab1 = createStackNavigator(
  {
    Domov: {
      screen: HomeScreen,
      navigationOptions: {
      },

    },
    /*MyProfil: {
      screen: MyProfil,
    }*/
  },
  {
    navigationOptions: {
      ...headerDefaultNavigationConfig
    }
  }
);

const Tab2 = createStackNavigator(
  {
    Dnevnik: {
      screen: Diary,
      navigationOptions: {
        headerTitle: "Tab2",
        headerLeft: (
          <Text>Ok</Text>
        )
      },
    }
  },
  {
    navigationOptions: {
      ...headerDefaultNavigationConfig
    }
  }
);

const bottomTabs = createBottomTabNavigator(
{
  Domov: Tab1,
  Dnevnik: Tab2,
},
{
  initialRouteName: "Domov",
  navigationOptions: ({ navigation }) => ({
      tabBarIcon: ({ focused, tintColor }) => {
        const { routeName } = navigation.state;
        let iconName;
        if (routeName === 'Domov') {
          //iconName = `home${focused ? '' : '-outline'}`;
          iconName='home';
        } else if (routeName === 'Dnevnik') {
          //iconName = `ios-calendar${focused ? '' : '-outline'}`;
          iconName='ios-calendar';
        } 

        // if focused return view with line
        if(focused) {
          return (
            <View style={styles.item}>
                <Icon name={iconName} style={{fontSize: 20, color: '#FFF'}} />
                <View style={styles.line}></View>
            </View>
          );
        } else {
          return(
            <Icon name={iconName} style={{fontSize: 20, color: '#FFF'}} />
          )
        }

      },

    }),
    tabBarPosition: 'bottom',
    tabBarOptions: {
      activeTintColor: 'white',
      showLabel: false,
      inactiveTintColor: '#4C2601',
      style: {
        backgroundColor: '#033D51',
      },
      labelStyle: {
        fontSize: 12,
        lineHeight: 30,
      },
    },
    swipeEnabled: true,

});

/*const All = createStackNavigator(
{
  "Home":{
    screen: bottomTabs,
    navigationOptions: {
        header: null,
    },
  },
  "MyProfil":{screen: MyProfil}, 
},
{
    initialRouteName: 'Home',
    headerMode: 'screen',
    navigationOptions: {
      ...HeaderStyles,
      animationEnabled: true
    }
}



);
*/




export default bottomTabs;

这是我更改屏幕的代码；

const { navigate } = this.props.navigation;         
navigate('MyProfil');