在通知中导航用户点击后台/前景中的应用程序

时间:2018-02-19 16:01:08

标签: react-native react-navigation react-native-fcm

我正在使用REACT-NATIVE-FCM。

我的应用程序在App.js中的堆栈导航器中有抽屉导航器。

在通知单击通知栏中我希望用户直接进入某个屏幕。

仅在应用程序关闭时才在主页中注册FCM事件,而在前台应用程序中则不会调用事件。它只会将您带到上一个打开的屏幕。

我必须在每个屏幕上注册FCM事件,这对我来说并不合适。所以我有解决方案在App.js中注册FCM事件,因为在初始化App时从index.js调用App.js但我无法在App.js中使用this.props.navigation.navigate。

使用反应导航我们如何在声明堆栈后重定向用户。

APP.JS

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


    const AppNavigator = StackNavigator(
        {
            Home: { screen: Home },
           Drawer: { screen: Drawer },
            ScreenABC: { screen: ScreenABC },
            ScreenXYZ: { screen: ScreenXYZ }
        },
        {
             headerMode: "none",
        }
    );


    export default () =>
        <Root>
            <AppNavigator />
        </Root>;


    //CALLED WHEN APP IN FOREGROUND
    this.notificationListener = FCM.on(FCMEvent.Notification, async (notif) => {
    //alert('FCM.on: ' + JSON.stringify(notif));
if(notif.routeValue == 1)
{
this.props.navigation.navigate("Screen1")}
    });

    //CALLED WHEN APP IN BACKGROUND
    FCM.getInitialNotification().then(notif => {

       });

1 个答案:

答案 0 :(得分:1)

如果你想真的去某个屏幕,无论如何。在致电navigate之前,您至少应该重置导航器状态。

或者您也可以创建自定义操作,调度此操作并返回正确的导航器状态。

以下是我将导航器状态重置为主页的方法:

export const homeNav = (state, action) => {
  let index;

  let routes;

  switch (action.type) {

 case types.RESET_HOME_NAV:
  routes = [...state.routes];

  for (let index = state.index; index > 0; --index) {
    routes.pop();
  }

  return {
    ...state,
    routes,
    index: 0,
  };

default:
  return NavigatorHome.router.getStateForAction(action, state);
}};