没有导航道具的反应导航在发布模式下不起作用（Android签名应用程序）

Question

我正在实现一个接收Firebase推送通知的React-native应用程序。通知到达时，应用程序导航至屏幕以显示通知。我使用参考使用了这种方法：“没有导航道具的导航”https://reactnavigation.org/docs/en/navigating-without-navigation-prop.html

当我在调试模式下对此进行测试时，它可以完美运行。但是，当我在发布模式（Android签名应用）下进行测试时，它不起作用。

尤其是当应用打开时通知到达时，它不起作用。没有错误消息，并且应用程序冻结，并且在30秒左右的时间内，应用程序崩溃。

以下是包装信息：

    "react": "16.8.3",
    "react-i18next": "10.12.2",
    "react-native": "0.59.10",
    "react-native-firebase": "5.5.6",
    "react-native-gesture-handler": "1.3.0",
    "react-navigation": "3.11.1",

基本上，我尝试过“没有导航道具的导航”https://reactnavigation.org/docs/en/navigating-without-navigation-prop.html

同样，这也是：https://github.com/react-navigation/react-navigation/issues/742

我使用的不是类组件，而是功能组件。

// Navigator.js

const switchNavigator = createSwitchNavigator({
  ResolveAuth: ResolveAuthScreen,
  loginFlow: createStackNavigator({
    Signin: SigninScreen,
    Signup: SignupScreen
  }),
  helpFlow: createStackNavigator({
    Help: HelpScreen,
  }, {headerLayoutPreset: 'center'}),
  mainFlow: createBottomTabNavigator({
    Ask: createStackNavigator({
      AskMain: AskScreen,
      AskWait: AskWaitScreen,
    }, {headerLayoutPreset: 'center'}),
    Chat: createStackNavigator({
      ChatList: ChatListScreen,
      Chatting: ChatScreen,
    }, {headerLayoutPreset: 'center'}),
    Profile: createStackNavigator({
      Account: AccountScreen,
      AccountEdit: AccountEditScreen,
      ProfileContract: ProfileScreen
    }
    , {headerLayoutPreset: 'center'})
  },
...
export default createAppContainer(switchNavigator);

// App.js

import Navigator from './Navigator';
import { useTranslation } from 'react-i18next';
import { navigate, setNavigator } from './src/navigationRef';

const App = Navigator;

export default () => {

  // setup language
  const { t } = useTranslation();

  // use effect
  useEffect(() => {

    // notification listener (triggered when a particular notification has been received)
    // if the app is foreground, we need to navigate the screen
    const listenerFG = firebase.notifications().onNotification((notification: Notification) => {
      console.log('onNotification', notification);
      Alert.alert(
        t('AppScreen.title'),
        t('AppScreen.message'),
        [
          {text: t('yes'), onPress: () => navigate('Help', { notificationBody: notification })},
        ],
        {cancelable: true},
      );
    });

   listenerForAppClosed();

   return () => {
      listenerFG();
    }
  }, []);

  return (
    <App ref={(navigator) => { setNavigator(navigator) }} /> 
  );

// navigationRef.js

import { NavigationActions } from 'react-navigation';

let navigator;

// nav is coming from react navigation
export const setNavigator = navRef => {
  console.log('navigation ref', navRef);
  // set navigator
  navigator = navRef;
};

export const navigate = (routeName, params) => {
  console.log('[navigate dispatch] navigator', navigator);
  navigator.dispatch(
    NavigationActions.navigate({
      routeName,
      params
    })
  );
};

在调试模式下，使用`navigate（'any screen'）就像一个超级按钮，但是在发行模式下，它不起作用。

但是奇怪的是，以下导航有效。当应用程序不是前台状态时，用户将打开推送通知。

// App.js的一部分

// listen the notification being opened or clicked when the app is closed
  const listenerForAppClosed = async() => {
    // app closed
    const notificationOpen: NotificationOpen = await firebase.notifications().getInitialNotification();
    if (notificationOpen) {
      // app was opened by a notification
      console.log('getInitialNotification', notificationOpen);
      // get information about the notification that was opened
      const notification: Notification = notificationOpen.notification;
      //// ignore the same notification id since the same notification is received again, don't know why.
      // get noti id from storage
      const notiId = await AsyncStorage.getItem('notiId');
      // set noti id to storage
      await AsyncStorage.setItem('notiId', notification.notificationId);     
      if (notification.notificationId === notiId) {
        console.log('notification id is the same');       
      } else { 
        console.log('navigating to helpscreen...');   
        // navigate to Help screen
        navigate('Help', { notificationBody: notification });
      }
    }
  }

问题同时在Android模拟器和设备（Android9）上发生。

为什么Navigation（'Help'）在发布模式下不起作用？我搜索了许多文档，我觉得它也应该在发布模式下工作。

还有其他方法可以从顶层（例如App.js）导航到屏幕吗？

Answer 1

我找到了问题的根源。我测试了几件事。我想知道发布模式下的非常简单的应用程序能否正确导航。因此，我只是关注此帖子：https://medium.com/@katharinep/firebase-notification-integration-in-react-native-0-60-3a8d6c8d56ff

这是我所做的：-创建了两个屏幕：“主页”和“通知”。-使用最新的[email protected]和[email protected]重新创建应用-发送的不是来自应用程序而是来自Firebase云消息传递的云消息

有效！通知到达时，应用程序导航到通知屏幕。

因此，我试图找出问题的根源。-尝试添加更多屏幕-添加了更多的提供者和上下文-从应用发送的消息

最后，我找到了来源。这就是我使用'navigateRef.js'的方式最初我是这样使用的：

// App.js
import { navigate, setNavigator } from './src/navigationRef';
<App ref={(navigator) => { setNavigator(navigator) }} /> 

// navigationRef.js
import { NavigationActions } from 'react-navigation';

let navigator;

// nav is coming from react navigation
export const setNavigator = navRef => {
  console.log('navigation ref', navRef);
  // set navigator
  navigator = navRef;
};

export const navigate = (routeName, params) => {
  console.log('[navigate dispatch] navigator', navigator);
  navigator.dispatch(
    NavigationActions.navigate({
      routeName,
      params
    })
  );
};

我只是简单地使用react-navigation中的代码：https://reactnavigation.org/docs/en/navigating-without-navigation-prop.html

// App.js
import NavigationService from './src/NavigationService';
<App
    ref={navigationRef => 
      {NavigationService.setTopLevelNavigator(navigationRef);}}
/>

// NavigationService.js
import { NavigationActions } from 'react-navigation';

let _navigator;

function setTopLevelNavigator(navigatorRef) {
  _navigator = navigatorRef;
}

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

// add other navigation functions that you need and export them

export default {
  navigate,
  setTopLevelNavigator,
}

然后我工作了！我不知道这两个代码的区别。第一个可以在调试模式下完美运行，但不能在发布模式下完美运行，尤其是该应用程序处于前台状态。

有人能告诉我区别吗？为什么第一个代码不起作用？