如何在反应原生导航时覆盖 backButton 的行为

如何解决如何在反应原生导航时覆盖 backButton 的行为

我使用 https://wix.github.io/react-native-navigation/docs/before-you-start/ 为我的 React Native 应用导航。我有一个问题,假设有三个 cmp A、B、C。从 comp A 有一个 history.push() 执行,它重定向到 cmp B,然后 cmp B 是一些路径匹配器,其中根据从 A 推送的路径呈现特定组件,假设 cmp B 匹配路径,然后呈现 C cmp ,其中 C 有这样的:

代码:

              Navigation.push(componentId,{
                component: {
                    id: 'BottomSheetRollupView',name: 'bottomSheet.Rollup',passProps: {
                        component,passProps,},options: {
                        statusBar: {
                            style: Platform.select({android: 'light',ios: 'dark'}),});

所以 C cmp 将一个新屏幕推送到堆栈,所以此时当从导航中单击返回时,我想将我重定向到 A 而不是 B。如何更改后退按钮的行为,或者我可以以某种方式禁用它?按后退按钮当前将我重定向回 cmp B,我不想这样做!

谢谢。

解决方法

您可以使用 navigation.addListener() 更改返回时的行为。我发现它有点笨拙,但它有效 - 在我们的例子中,如果数据丢失,我们会警告返回。我们还必须区分 Save 和 Back 按下,我们通过在按下 Save 按钮时设置状态标志来做到这一点。这是钩子的样子 - 我认为它应该适合您的需求:

// Based on: https://reactnavigation.org/docs/preventing-going-back/
function useAlertOnGoBack({
  hasEdited,didSave,}: {
  hasEdited: boolean;
  didSave: boolean;
}) {
  const navigation = useNavigation();
  useEffect(() => {
    const unsubscribe = navigation.addListener("beforeRemove",e => {
      if (!hasEdited || didSave) {
        // No listener
        return;
      }

      // Prevent default behavior of leaving the screen
      e.preventDefault();

      showExitWithoutSavingAlert(() => navigation.dispatch(e.data.action));
    });

    return unsubscribe;
  },[hasEdited,navigation,didSave]);
}

export function showExitWithoutSavingAlert(dismissScreen: () => void) {
  // Prompt the user before leaving the screen
  Alert.alert("Discard unsaved changes?",undefined,[
    {
      text: "Discard Changes",style: "destructive",// If the user confirmed,then we dispatch the action we blocked earlier
      // This will continue the action that had triggered the removal of the screen
      onPress: dismissScreen,},{ text: "Cancel",style: "cancel",onPress: () => {} },]);
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?
Java在半透明框架/面板/组件上重新绘画。
Java“ Class.forName()”和“ Class.forName()。newInstance()”之间有什么区别?
在此环境中不提供编译器。也许是在JRE而不是JDK上运行?
Java用相同的方法在一个类中实现两个接口。哪种接口方法被覆盖?
Java 什么是Runtime.getRuntime()。totalMemory()和freeMemory()?
java.library.path中的java.lang.UnsatisfiedLinkError否*****。dll
JavaFX“位置是必需的。” 即使在同一包装中
Java 导入两个具有相同名称的类。怎么处理?
Java 是否应该在HttpServletResponse.getOutputStream()/。getWriter()上调用.close()?
Java RegEx元字符(。)和普通点?