React native 使用'；反应本机导航'；

我已经使用“react native navigation”和第一个导航创建了应用程序，运行良好

 Navigation.startSingleScreenApp({
      screen: {
          screen: 'drawer.HomeScreen',
          title: '',
          navigatorStyle: {
              navBarHidden: true
          }
      }
  });

我在航海方面遇到了问题

import { Navigation } from 'react-native-navigation';

并尝试使用

Navigation.push({
      component: {
          name: 'drawer.DashboardScreen'
      }
});

startMainTab.js

 const startTabs = () => {
      Promise.all([
          Icon.getImageSource("ios-share-alt", 30),
          Icon.getImageSource("ios-menu", 30)
      ]).then(sources => {
          Navigation.startTabBasedApp({
              tabs: [{
                      screen: 'drawer.AnalyticsScreen',
                      navigatorButtons: {
                          leftButtons: [{
                              icon: sources[1],
                              title: "Menu",
                              id: 'sideDrawerToggle'
                          }]
                      }
                  },
                  {
                      screen: 'drawer.DashboardScreen',
                      navigatorButtons: {
                          leftButtons: [{
                              icon: sources[1],
                              title: "Menu",
                              id: 'sideDrawerToggle'
                          }]
                      }
                  }
              ],
              drawer: {
                  left: {
                      screen: 'drawer.SideDrawer'
                  }
              }
          });
      });
  }

  export default startTabs;

      export default class SideDrawer extends Component {

      constructor(props) {
          super(props);
          this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent);
      }

      componentWillMount() {
          this.props.navigator.setOnNavigatorEvent(this.onNavigationEvent)
      }

  onNavigationEvent = (event) => {
          // handle a deep link
          if (event.type == 'DeepLink') {
              const parts = event.link;
              alert("Scree: " + parts)
              //this.navigateToAbout()                  

              this.props.navigator.push({
                  screen: "drawer.HomeScreen"
              })
              if (parts == 'drawer.DashboardScreen') {
                  //this.onPressScreen1();
              }
          }
      }

      navigateToAbout = () => {
          this.props.navigator.push({
              screen: 'drawer.DashboardScreen'
          })

      }
      render() {
          return ( <
              View style = {
                  styles.container
              } >
              <
              Text > SideDrawer < /Text> <
              TouchableHighlight onPress = {
                  this.navigateToAbout.bind(this)
              } >
              <
              Text > Click Me < /Text> <
              /TouchableHighlight> <
              /View>
          )
      }
  }

SideDrawer.js

 const startTabs = () => {
      Promise.all([
          Icon.getImageSource("ios-share-alt", 30),
          Icon.getImageSource("ios-menu", 30)
      ]).then(sources => {
          Navigation.startTabBasedApp({
              tabs: [{
                      screen: 'drawer.AnalyticsScreen',
                      navigatorButtons: {
                          leftButtons: [{
                              icon: sources[1],
                              title: "Menu",
                              id: 'sideDrawerToggle'
                          }]
                      }
                  },
                  {
                      screen: 'drawer.DashboardScreen',
                      navigatorButtons: {
                          leftButtons: [{
                              icon: sources[1],
                              title: "Menu",
                              id: 'sideDrawerToggle'
                          }]
                      }
                  }
              ],
              drawer: {
                  left: {
                      screen: 'drawer.SideDrawer'
                  }
              }
          });
      });
  }

  export default startTabs;

      export default class SideDrawer extends Component {

      constructor(props) {
          super(props);
          this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent);
      }

      componentWillMount() {
          this.props.navigator.setOnNavigatorEvent(this.onNavigationEvent)
      }

  onNavigationEvent = (event) => {
          // handle a deep link
          if (event.type == 'DeepLink') {
              const parts = event.link;
              alert("Scree: " + parts)
              //this.navigateToAbout()                  

              this.props.navigator.push({
                  screen: "drawer.HomeScreen"
              })
              if (parts == 'drawer.DashboardScreen') {
                  //this.onPressScreen1();
              }
          }
      }

      navigateToAbout = () => {
          this.props.navigator.push({
              screen: 'drawer.DashboardScreen'
          })

      }
      render() {
          return ( <
              View style = {
                  styles.container
              } >
              <
              Text > SideDrawer < /Text> <
              TouchableHighlight onPress = {
                  this.navigateToAbout.bind(this)
              } >
              <
              Text > Click Me < /Text> <
              /TouchableHighlight> <
              /View>
          )
      }
  }

导出默认标准选项卡；
导出默认类SideDrawer扩展组件{
建造师（道具）{
超级（道具）；
this.props.navigator.setOnNavigatorEvent（this.onNavigatorEvent）；
}
组件willmount（）{
this.props.navigator.setOnNavigatorEvent（this.onNavigationEvent）
}
onNavigationEvent=（事件）=>{
//处理深层链接
如果（event.type==“DeepLink”）{
const parts=event.link；
警报（“屏幕：+部件）
//this.navigateToAbout（）
这个是.props.navigator.push({
屏幕：“抽屉。主屏幕”
})
如果（部件=='drawer.DashboardScreen'）{
//这个。onPressScreen1（）；
}
}
}
navigateToAbout=（）=>{
这个是.props.navigator.push({
屏幕：“抽屉。仪表板屏幕”
})
}
render（）{
报税表（<
视图样式={
样式.容器
} >
<
文本>侧抽屉<
触控突出显示按下={
this.navigateToAbout.bind（this）
} >
<
文本>单击我<
/可触摸高光><
/查看>
)
}
}

由于按下屏幕是在现有导航堆栈上执行的操作，因此需要在当前组件导航器对象上调用它，该对象将自动作为道具获取：

this.props.navigator.push（{screen:'drawer.DashboardScreen'}）

---

我强烈建议您迁移到react native navigation v2，因为v1功能有限，不再维护。

从此处下载源代码（）

App.js:

import React, {Component} from 'react';
import {createStackNavigator,createAppContainer} from 'react-navigation'
import HomeScreen from './Screens/HomeScreen';
import ProfileScreen from './Screens/ProfileScreen';
import ContactScreen from './Screens/ContactScreen';
import MainScreen from './Screens/MainScreen'


export default class App extends Component {
render() {

return <AppNavigationContainer/>

}

}
const AppNavigator = createStackNavigator({

Main:MainScreen,

Home: HomeScreen,

Profile: ProfileScreen,

Contact:ContactScreen

}, {

initialRouteName: 'Main',

navigationOptions: {

headerTitleStyle: {

fontWeight: "bold",

color: "red",

},

headerTintColor: "red"

}

})

const AppNavigationContainer = createAppContainer(AppNavigator);

---

谢谢

@Ved您在哪里调用

this.props.navigator.push

？您是否收到错误消息？@Ved尝试向屏幕添加

title

属性，并确保已通过

导航.registerComponent（）

注册该属性。检查这个例子，让我们看看。