Question

我有一个简单的导航设置。我想将StackNavigator用于身份验证路由，将TabNavigator用于其他内容。
我创建了这两个导航器：

const PreContentNavigator = createStackNavigator({ // Non auth routes
    Landing: {
        screen: Landing
    },
    LogIn: {
        screen: LogIn
    },
    SignUp: {
        screen: SignUp
    }
}, {
    navigationOptions: {
        header: null
    }
});

const ContentNavigator = createBottomTabNavigator({ // Auth routes
    Dashboard: {
        screen: Dashboard
    },
    Library: {
        screen: Library
    },
    Settings: {
        screen: Settings
    }
});

我已经将SwitchNavigator和这两个都链接了，因为根据文档，这似乎是推荐的方式。该代码如下所示：

const MainNavigator = createSwitchNavigator({
    PreContent: {
        screen: PreContentNavigator
    },
    Content: {
        screen: ContentNavigator,
    }
});

现在，这似乎可行，但是有一个很大的问题。有一次，我想将用户从PreContentNavigator导航到ContentNavigator。我在Landing页面上尝试过：

const Landing = (props) => {
    return (
        <View style={styles.body}>
            <TouchableHighlight>
                <Text>Nextbook</Text>
            </TouchableHighlight>
            <TouchableHighlight>
                <Text>Log In</Text>
            </TouchableHighlight>
            <TouchableHighlight>
                <Text>Sign Up</Text>
            </TouchableHighlight>
            <TouchableHighlight onPress={() => props.navigation.navigate("Content"/*"LogIn"*/)}> // Using LogIn does work!
                <Text>Skip for now...</Text>
            </TouchableHighlight>
        </View>
    );
};

问题在于这根本行不通。但是我可以从PreContentNavigator内部的路线导航到PreContentNavigator中的其他路线（请参见代码中的注释）。
我觉得the example on the official plugin page使用的是与我使用的完全相同的原理。那么有人可以指出我在哪里缺少什么吗？

使用SwitchNavigator在导航器之间切换（反应导航）

0 个答案: