我已经实现了一个弹出窗口组件在一个标题与更多的选项按钮。此按钮仅在UserProfileScreen上可用。当你按下它时，你会看到两个按钮：“设置”和“注销”。问题与设置按钮有关。

**预期行为：**按“设置”按钮-〉this。props.navigation.navigate（'SettingsNavigator'）被调用-〉显示SettingsScreen
**实际行为：**按下设置按钮-〉控制台。warn（'go to settings'）被调用，仅此而已（您不会被重定向到SettingsScreen）。
设置导航器。js

import React from 'react';
import { createStackNavigator } from 'react-navigation';

import SettingsScreen from './SettingsScreen';
import EditProfileScreen from './EditProfileScreen';
import RemoveProfileScreen from './RemoveProfileScreen';

const SettingsNavigator = createStackNavigator({
    SettingsScreen: SettingsScreen,
    EditProfile: EditProfileScreen,
    RemoveProfile: RemoveProfileScreen
}, {
    initialRouteName: 'SettingsScreen'
});

export default SettingsNavigator;

optionHeaderButton。js

import { withNavigation } from 'react-navigation';
...

class OptionsHeaderButton extends Component {

    ...

    navigateToSettings = () => {
        console.warn('go to settings')
        this.props.navigation.navigate('SettingsNavigator');
    }

    render() {
    return(
        <Menu onSelect = {value => {
            switch(value) {
                case 'Settings':
                    this.navigateToSettings();
                    break;
                case 'Logout':
                    this.onLogOutPress();
                    break;
            }
        }}>

            <MenuTrigger>
                <Icon name = 'dots-vertical' size = {24} color = {text}/>
            </MenuTrigger>

            <MenuOptions style = {optionsHeaderButtonStyle.menuWrapper}>

                <MenuOption value = {'Settings'}>
                    <View style = {optionsHeaderButtonStyle.optionWrapper}>
                        <View style = {optionsHeaderButtonStyle.optionIcon}>
                            <IconSimpleLine name = 'settings' size = {12} color = {text}/>
                        </View>
                        <Text style = {[optionsHeaderButtonStyle.option, optionsHeaderButtonStyle.lastOption]}>
                            Settings
                        </Text>
                    </View>
                </MenuOption>

                <MenuOption value = {'Logout'}>
                    <View style = {optionsHeaderButtonStyle.optionWrapper}>
                        <View style = {optionsHeaderButtonStyle.optionIcon}>
                            <IconSimpleLine name = 'logout' size = {12} color = {text}/>
                        </View>
                        <Text style = {[optionsHeaderButtonStyle.option, optionsHeaderButtonStyle.lastOption]}>
                            Logout
                        </Text>
                    </View>
                </MenuOption>

            </MenuOptions>

        </Menu>
    )
}
}

export default withNavigation(OptionsHeaderButton);

OptionsHeaderButton嵌套到嵌套在UserProfile组件中的Header组件。
据我所知，使用withNavigation()，我可以从任何组件调用navigation.navigate()。那为什么不起作用呢

更新：

经过调查，我发现这个问题与2017年4月发现的React Navigation的一个bug有关。这意味着你只能在一个堆栈中使用navigation.navigate()。但我找不到任何有关修复此错误的信息。