Question

我正在尝试在我的应用程序中实现抽屉式导航。我发现这个网站（https://reactnavigation.org/docs/en/drawer-based-navigation.html）提供了实现的代码示例，但是当我运行它时，它说

找不到变量：createDrawerNavigator。

因此，这意味着缺少导入。但是，我似乎找不到createDrawerNavigator的合适人选。想知道是否有人可以帮助我解决这个问题！对React Native来说还很新。

class MyHomeScreen extends React.Component {
    static navigationOptions = {
        drawerLabel: 'Home',
        drawerIcon: ({
            tintColor
        }) => ( <
            Image source = {
                require('./chats-icon.png')
            }
            style = {
                [styles.icon, {
                    tintColor: tintColor
                }]
            }
            />
        ),
    };

    render() {
        return ( <
            Button onPress = {
                () => this.props.navigation.navigate('Notifications')
            }
            title = "Go to notifications" /
            >
        );
    }
}

class MyNotificationsScreen extends React.Component {
    static navigationOptions = {
        drawerLabel: 'Notifications',
        drawerIcon: ({
            tintColor
        }) => ( <
            Image source = {
                require('./notif-icon.png')
            }
            style = {
                [styles.icon, {
                    tintColor: tintColor
                }]
            }
            />
        ),
    };

    render() {
        return ( <
            Button onPress = {
                () => this.props.navigation.goBack()
            }
            title = "Go back home" /
            >
        );
    }
}

const styles = StyleSheet.create({
    icon: {
        width: 24,
        height: 24,
    },
});

const MyApp = createDrawerNavigator({
    Home: {
        screen: MyHomeScreen,
    },
    Notifications: {
        screen: MyNotificationsScreen,
    },
});

Answer 1

您使用的每个子组件都必须首先导入：正如Pritish Vaidva所述，您必须添加

import { createStackNavigator, createDrawerNavigator } from "react-navigation";

位于文件开头。

Answer 2

createDrawerNavigator现在从最新版本的npm中的“反应导航”切换到“反应导航抽屉”，并做出反应使用以下代码

import { createDrawerNavigator } from 'react-navigation-drawer';

找不到变量：createDrawerNavigator

2 个答案: