在渲染中使用 Stack navigator 从 app.js 导航答案

【问题标题】：Navigate from app.js with Stack navigator in render在渲染中使用 Stack navigator 从 app.js 导航
【发布时间】：2020-02-06 13:37:03
【问题描述】：

我使用https://reactnavigation.org，但如果文件导航位于 app.js 中，我不明白如何导航...

我测试了 NavigationService，但我不明白它是如何工作的......

我在 App.js 中的代码

import NavigationService from './src/utils/helpers/NavigationService';

const App = () => {

var PushNotification = require("react-native-push-notification");

  PushNotification.configure({
    onNotification: function(notification) {

        let num = 0;
        if (Platform.OS === 'ios') {
          num = notification.data.num;
        } else {
          num = notification.userInfo.num;
        }

        switch(num) {

          case 1:
            NavigationService.navigate('Scan', {a: 'a'});
            break;

          default:
            console.warn("NUMBER NOT FOUND");

        }
    }
  })

  return (
    <AppNavigator />
  );

export default App;

MainNavigation.js

const MyDrawerNavigator = createDrawerNavigator({
  Home: {
    screen: HomeScreen,
  },
  Scan: {
    screen: ScanScreen,
  },
});

export default createAppContainer(MyDrawerNavigator);

导航服务

import { NavigationActions } from 'react-navigation';

let _navigator;

function setTopLevelNavigator(navigatorRef) {
  _navigator = navigatorRef;
}

function navigate(routeName, params) {
  _navigator.dispatch(
    NavigationActions.navigate({
      routeName,
      params,
    })
  );
}

export default {
  navigate,
  setTopLevelNavigator,
};

如何从 app.js 文件导航？

【问题讨论】：

标签： react-native navigation navigation-drawer react-navigation

【解决方案1】：

根据documentation，

更改您的 MainNavigation.js 文件默认导入来源

export default createAppContainer(MyDrawerNavigator);

到

import NavigationService from './src/utils/helpers/NavigationService';

.....

export default class App extends React.Component {
  // ...

  render() {
    return (
      <AppContainer
        ref={navigatorRef => {
          NavigationService.setTopLevelNavigator(navigatorRef);
        }}
      />
    );
  }
}

【讨论】：