Question

我正在拼命寻找检查ReactNavigation中是否存在先前屏幕的可能性。

如果不存在先前路由，则使用this.props.navigation.goBack()返回false，但我无法使用它，因为如果存在先前路由，则会重定向。

是否有可能检查我是否打开应用程序而不是从另一个屏幕导航到主屏幕？

谢谢。我没有使用Redux。它会使这些东西更容易，但我想避免使用它。

Answer 1

什么是解决方案（不确定它是最好的解决方案）将花费在前一个屏幕的param对象中。如果存在params意味着存在前一个屏幕。

例如：

const navigateAction = NavigationActions.navigate({
  routeName: 'Profile',

  params: { previous_screen: 'CURRENT_SCREEN' },

  action: NavigationActions.navigate({ routeName: 'NEXT_SCREEN' }),
});

this.props.navigation.dispatch(navigateAction);

然后在下一个屏幕中：

const { navigation } = this.props;
if (navigation.state.params && navigation.state.params.previous_screen) {
  // A previous screen exists
} else {
  // No previous screen
}

Answer 2

从React Navigation 5开始，您可以通过以下方式在功能组件内部使用useNavigationState钩子：

const routesLength = useNavigationState(state => state.routes.length);
console.log('routesLength', routesLength);

如果routesLength> 1，则它不是堆栈中的第一个屏幕

或者您可以使用navigation.canGoBack()

Answer 3

有一种更简单的方法：

if(this.props.navigation.isFirstRouteInParent()) {
    //a previous screen does not exist
} else {
    //a previous screen does exist
}

Answer 4

const navigateAction = NavigationActions.navigate({
  routeName: 'NEXT_SCREEN',
  action: NavigationActions.navigate({ routeName: 'NEXT_SCREEN', params: { previous_screen: 'CURRENT_SCREEN' } }),
});
this.props.navigation.dispatch(navigateAction);

Answer 5

对我来说完全正常。如果您想从React Native应用程序的导航堆栈中找到先前的路线/屏幕名称，以便可以使用此功能。

export const previousRouteName = (navigation) =>{
  let navRoutes = navigation.dangerouslyGetParent().state.routes;
  if (navRoutes.length >= 2){
    return navRoutes[navRoutes.length - 2].routeName
  }
  return navigation.state.routeName
}

如何使用？

previousRouteName(props.navigation);

希望您喜欢K00L并为您提供帮助;）

如果以前的屏幕存在，则进行React Navigation检查

5 个答案: