Question

我正在使用反应导航。使用堆栈导航器和嵌套在其中的抽屉。如何在下面的代码中调用componentdidmount和this.props.navgation.navigate。我有一些事件应该导航用户到特定的屏幕而不是跟随抽屉的初始路线。

 import React from "react";
    import { Platform, Text } from "react-native";
    import { Root } from "native-base";
    import { StackNavigator, DrawerNavigator} from "react-navigation";
    import Register from "./components/Register";
    import Home from "./components/home/";
    import Dashboard from "./components/Dashboard/";
    import SideBar from "./components/sidebar";
    import Screen1 from "./components/Screen1/";
    import Screen2 from "./components/Screen2/";
    import Screen3 from "./components/Screen3/";

    const Drawer = DrawerNavigator(
      {
        Dashboard: { screen: Dashboard },
        Screen1: { screen: Screen1 },
        Screen2 : { screen: Screen2 },
      },
      {
        navigationOptions: {
          gesturesEnabled: false,
        },
       initialRouteName: "Dashboard",
        contentOptions: {
          activeTintColor: "#e91e63"
        },
        drawerPosition: 'right',
        contentComponent: props => <SideBar {...props} />
      }
    );


    const AppNavigator = StackNavigator(
        {
            Home: { screen: Home },
            Register: { screen: Register },
            Drawer: { screen: Drawer },
            Screen3: { screen: Screen3 },
        },
        {

             headerMode: "none",

        }
    );


//HOW TO WRITE COMPONENTDIDMOUNT HERE AND CALL //THIS.PROPS.NAVIGATION.NAVIGATE
    export default () =>
        <Root>
            <AppNavigator />
        </Root>;

Answer 1

你没有创建一个组件，那么你就无法写出＆＃34; ComponentDidMount在这里。

<Root>拥有自己的componentDidMount，在您渲染时会运行。

请务必充分了解 React 和 JSX 如何协同工作： https://reactjs.org/docs/rendering-elements.html

反应导航Stack Navigator componentdidMount

1 个答案: