Question

我通过开发我的应用程序在React Navigation中使用NavigationService method。我有一个由Redux开发的Auth页面。当用户登录Auth页面时，该页面将链接到Main Page。

但是，我可以滑动（在IOS中）或按下后退按钮（在Android中）返回到“身份验证”页面。用户登录或通过身份验证页面后，如何重置导航器？

这是我下面的登录过程的功能：

const loginSuccess = (dispatch, user) => {

   console.log('LOGINSUCCESS --> OK!');
  return dispatch => {
    NavigationService.navigate('Main');
    dispatch({
      type: LOGIN_USER_SUCCESS,
      payload: user,
    });
  };
};

Answer 1

不需要从方法返回。它将直接移至特定屏幕。

dispatch(
    NavigationService.navigate('Main')
  );

Answer 2

我已经解决了这个问题。

首先，我想在下面显示我的NavigationService.js代码：

import { NavigationActions, StackActions } 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,
  navigateReset,
  setTopLevelNavigator,
};

然后，我添加了一些代码来重置导航器。（这意味着当您通过下一个屏幕时，再也不会通过滑动或Android后退按钮再次回来。）

function navigateReset(routeName, params) {
  _navigator.dispatch(
    StackActions.reset({
      index: 0,
      actions: [
        NavigationActions.navigate({
          routeName,
          params,
        }),
      ],
    }),
  );
}

最后，我用新功能编辑了动作代码：

const loginSuccess = (dispatch, user) => {
  firebase
    .database()
    .ref('/users/' + user.user.uid)
    .once('value')
    .then((snapshot) => {
      dispatch({
        type: LOGIN_USER_SUCCESS,
        payload: user,
        myUser: {
          uid: user.user.uid,
          email: user.user.email,
          name: snapshot.val().displayName,
          groups: snapshot.val().groups,
        },
      });
    });

  dispatch(() => {
    NavigationService.navigateReset('Main'); // Edited code.
  });

  console.log('LOGINSUCCESS --> OK!');
};

Taa taa！恭喜！现在，登录后您再也不会回到登录屏幕。

如何在React Navigation中使用NavigationService重置导航器？

2 个答案: