javascript - 使用 NavigationService 在 React 组件之外的 React Native 中导航、弹出、重置

Question

我将在 React 组件之外使用 react navigation，因此我无法访问 props，我可以为 navigate 执行此操作，但我没有知道如何实现 reset 和 pop 这是我的 navigate 代码:

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,
};

Answer 1

首先在NavigationService中导入StackActions

import {
  NavigationActions,
  StackActions,
} from "react-navigation";

添加弹出和替换功能

function replace(routeName, params) {
  _navigator.dispatch(
    StackActions.replace({
      routeName,
      params
    })
  );
}

function pop(number = 1) {
  _navigator.dispatch(
    StackActions.pop({
      n: number
    })
  );
}

注意:Pop 有参数要弹出多少个屏幕。默认为1表示当前屏幕