我如何在课堂上使用 CREATESTACKNAVIGATOR？反应原生答案

【问题标题】：HOW DO I USE CREATESTACKNAVIGATOR IN CLASS? REACT-NATIVE我如何在课堂上使用 CREATESTACKNAVIGATOR？反应原生
【发布时间】：2021-01-13 04:54:32
【问题描述】：

我是 react-native 的新手，我正在尝试构建侧边菜单，问题是他们使用的所有示例都使用了钩子，而现在我正在使用类，这是我的侧边菜单结构：

import Home from "../screens/Home";
import Create_note from "../screens/Create_Note";
import Edit_note from "../screens/Edit_Note";

class Slide_menu extends Component {

    Drawer = createDrawerNavigator();
    
    render() {

        return (
            <NavigationContainer>
                <this.Drawer.Navigator initialRouteName = "Home">
                    <this.Drawer.Screen name = "Home" component = {Home}/>
                </this.Drawer.Navigator>            
            </NavigationContainer>
        )
    }
}

export default Slide_menu;

它可以工作，因为它会显示菜单和 Home 选项，现在的问题是我从 Home 组件打开了一个 Notes 组件，然后我在应用程序中导航：

import React, { Component } from "react";
import { createStackNavigator } from "react-navigation-stack";
import Notes from "../components/Notes";

class Home extends Component {
    render() {
        return (
            <>
                <Notes navigation = {this.props.navigation}></Notes>
            </>
        );
    }
}

export default Home;

它会显示注释，但是当我单击其中一个注释来运行此功能时：

select_edit(item) {
    this.note = item;
    this.note_number = item.note_number;
    if (this.onpress) {
        this.set_color();
    }else {
        this.props.navigation.navigate("Edit_note");
    }
}

它给了我错误：

console.error: The action NAVIGATE with playload {"name":Edit_note} was not handled by any navigator
do you have a screen named 'Edit_note"?

如何解决这个问题？

【问题讨论】：

请修正您的大写标题。（不是我的反对票）

标签： javascript react-native android-studio

【解决方案1】：

您只需将 Edit_note 添加到您的导航器：

import Home from "../screens/Home";
import Create_note from "../screens/Create_Note";
import Edit_note from "../screens/Edit_Note";

class Slide_menu extends Component {

    Drawer = createDrawerNavigator();
    
    render() {

        return (
            <NavigationContainer>
                <this.Drawer.Navigator initialRouteName = "Home">
                    <this.Drawer.Screen name = "Home" component = {Home}/>
                    <this.Drawer.Screen name = "Edit_note" component = {Edit_note}/>
                </this.Drawer.Navigator>            
            </NavigationContainer>
        )
    }
}

export default Slide_menu;

【讨论】：