Question

我正在使用React Navigation 3升级我的React Native应用程序的路由器配置，并且现在已经进行了许多改进，但是我不明白为什么当我在Android中按下“后退”按钮时，无法将我发送到上一个视图，并且而是把我送回家了。

我的路线

const drawerConfig = {
  initialRouteName: 'Home',
  contentComponent: SideMenu,
  drawerWidth: width,
}

const MainDrawerNavigator = createDrawerNavigator(
  {
    Home: {
      screen: Home,
    },
    Company: {
      screen: Company,
    },
    Gifts: {
      screen: Gifts,
    },
    Jobs: {
      screen: Jobs,
    },
    Job: {
      screen: Job,
    },
    Contact: {
      screen: Contact
    }
  },
  drawerConfig,
);

const InitialStack = createStackNavigator(
  {
    Menu: {
      screen: Menu,
      path: 'menu/',
    }
  },
  {
    initialRouteName: 'Menu',
    headerMode: 'none',
  }
);

const SwitchNavigator = createSwitchNavigator(
  {
    Init: InitialStack,
    App: MainDrawerNavigator,
  },
  {
    initialRouteName: 'Init',
  }
);

const AppContainer = createAppContainer(SwitchNavigator);

export default AppContainer;

如果执行此操作：打开抽屉，打开“作业”，然后按作业按钮以加载“作业”视图，流程运行良好，但如果在作业视图中按“后退”按钮，则不显示“作业”，而是“主页”。 / p>

我正在使用this.props.navigation.navigate('...')进行导航，因为该推送不起作用。

你知道为什么吗？

我正在使用反应导航3.5.1 和反应本地0.59.3

Answer 1

您可以从“ react-native”导入BackHandler，并可以在想要返回的屏幕类中使用以下代码：

componentWillMount() {
    BackHandler.addEventListener('hardwareBackPress', this.handleBackButton);
}

componentWillUnmount() {
    BackHandler.removeEventListener('hardwareBackPress', this.handleBackButton);
}

handleBackButton = () => {
    this.props.navigation.goBack();
    return true;
};

Answer 2

我刚刚想通了。

我没有为我的路线编写正确的配置，因为如果我想从Job转到Jobs而不是Home，那么对于每个所需的视图“堆栈”都必须有一个堆栈，因此现在它们可以按照我想要的方式正常工作，无需使用back handler事件，弹出窗口的效果很好。

赞：

library(tidyverse)
dat %>%
    left_join(dat, by = c("Column1")) %>%
    filter(Column2.y - Column2.x == 1) %>%
    select(
        Col1 = Column1,
        Col2 = Column2.x, Col3 = Column2.y,
        Col4 = Column3.x, Col5 = Column3.y,
        Col6 = Column4.x, Col7 = Column4.y)
## A tibble: 6 x 7
#  Col1    Col2   Col3 Col4   Col5    Col6  Col7
#  <chr>  <dbl>  <dbl> <chr>  <chr>  <dbl> <dbl>
#1 A     201801 201802 Active Active   100    97
#2 A     201802 201803 Active Active    97    95
#3 A     201803 201804 Active Closed    95     0
#4 B     201803 201804 Active Active    50    45
#5 B     201804 201805 Active CO        45    45
#6 C     201803 201804 Active BK       100    90

感谢所有帮助过我的人：）

React Navigation 3：Android中的“后退”按钮不会返回上一屏幕

2 个答案: