如何隐藏React Native导航器的后退按钮

E_Jovi

我做了一个登录按钮,它将跳转到main-ui。我不希望人们在导航器默认样式的左上角看到后退按钮。

似乎NavigatorIOS没有合适的API可以使用。你能给我个主意吗?

亚当·特尔森

您必须使用Navigator我建议将它与React Native Navbar结合使用

使用Navbar,您可以传递左右按钮组件...或者,如果它们不可见,则只需将它们设为空视图即可。该属性是leftButtonrightButton

React文档上的导航器示例应该可以帮助您入门:

<Navigator
    initialRoute={{name: 'My First Scene', index: 0}}
    renderScene={(route, navigator) =>
      <MySceneComponent
        name={route.name}
        onForward={() => {
          var nextIndex = route.index + 1;
          navigator.push({
            name: 'Scene ' + nextIndex,
            index: nextIndex,
          });
        }}
        onBack={() => {
          if (route.index > 0) {
            navigator.pop();
          }
        }}
      />
    }
  />

现在,在MySceneComponent的定义中将包括显示NavBar:

const MySceneComponent = (props) => (
    <View style={{ flex: 1, }}>
      <NavigationBar
        title={titleConfig}
        rightButton={BUTTON_OR_NOT} 
        {...props} />
      {props.children}
    </View>
);

当然,您可能希望将导航位抽象到一个组件中,该组件将在其周围显示导航栏,如上图所示{children}您将进一步希望将routenavigation信息传递到Navbar中,以便它可以显示页面信息并使之生效,以便单击后退按钮进行调用navigator.pop(),这是我通过propsvia传递的信息{...props}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在React Native v.5中离开某个屏幕时,如何隐藏底部的标签导航器?

来自分类Dev

React Native 导航器的本地化

来自分类常见问题

Swift-如何在导航项中隐藏后退按钮?

来自分类Dev

如何在导航栏Xamarin表单中隐藏后退按钮

来自分类Dev

SwiftUI如何在保持后退按钮的同时隐藏导航栏

来自分类Dev

无法隐藏导航栏后退按钮(SwiftUI)

来自分类Dev

如何在React Native导航器中禁用向后滑动

来自分类Dev

如何在React Native中使用抽屉导航器?

来自分类Dev

如何隐藏React Native NavigationBar

来自分类Dev

如何更改导航栏的后退按钮的字体?

来自分类Dev

嵌套在堆栈导航器中的React Native选项卡导航器

来自分类Dev

如何不让某人点击导航器的返回按钮?

来自分类Dev

在React-Native中从Drawer在Android上引用导航器

来自分类Dev

React Native:导航器弹出窗口上的更新视图(ListView)

来自分类Dev

React Native-导航器和标签栏集成

来自分类Dev

react-native-导航器和工具栏

来自分类Dev

React Native中每种用户类型的差异抽屉导航器

来自分类Dev

React-Native-标签导航器嵌套在抽屉内

来自分类Dev

Redux 中的 React-native 嵌套导航器

来自分类Dev

使用 React Native 的未定义导航器

来自分类Dev

如何在react-native中隐藏顶部导航栏?

来自分类Dev

React Native - 基于状态的条件后退按钮

来自分类Dev

在Swift中使用hidesBackButton在导航栏中隐藏后退按钮

来自分类Dev

我如何处理 React Native 中的后退按钮?

来自分类Dev

UIView隐藏导航栏后退按钮文本如何使其可见?

来自分类Dev

React Native - 无法获取已通过导航器(从堆栈导航器到抽屉导航器)传递的参数。接收:对象未定义

来自分类Dev

如何在React Native导航器中禁用向后滑动手势

来自分类Dev

如何在React Native中将组件正确导入到我的导航器中?

来自分类Dev

如何设计React-Native Android应用程序的导航器结构?

Related 相关文章

  1. 1

    在React Native v.5中离开某个屏幕时,如何隐藏底部的标签导航器?

  2. 2

    React Native 导航器的本地化

  3. 3

    Swift-如何在导航项中隐藏后退按钮?

  4. 4

    如何在导航栏Xamarin表单中隐藏后退按钮

  5. 5

    SwiftUI如何在保持后退按钮的同时隐藏导航栏

  6. 6

    无法隐藏导航栏后退按钮(SwiftUI)

  7. 7

    如何在React Native导航器中禁用向后滑动

  8. 8

    如何在React Native中使用抽屉导航器?

  9. 9

    如何隐藏React Native NavigationBar

  10. 10

    如何更改导航栏的后退按钮的字体?

  11. 11

    嵌套在堆栈导航器中的React Native选项卡导航器

  12. 12

    如何不让某人点击导航器的返回按钮?

  13. 13

    在React-Native中从Drawer在Android上引用导航器

  14. 14

    React Native:导航器弹出窗口上的更新视图(ListView)

  15. 15

    React Native-导航器和标签栏集成

  16. 16

    react-native-导航器和工具栏

  17. 17

    React Native中每种用户类型的差异抽屉导航器

  18. 18

    React-Native-标签导航器嵌套在抽屉内

  19. 19

    Redux 中的 React-native 嵌套导航器

  20. 20

    使用 React Native 的未定义导航器

  21. 21

    如何在react-native中隐藏顶部导航栏?

  22. 22

    React Native - 基于状态的条件后退按钮

  23. 23

    在Swift中使用hidesBackButton在导航栏中隐藏后退按钮

  24. 24

    我如何处理 React Native 中的后退按钮?

  25. 25

    UIView隐藏导航栏后退按钮文本如何使其可见?

  26. 26

    React Native - 无法获取已通过导航器(从堆栈导航器到抽屉导航器)传递的参数。接收:对象未定义

  27. 27

    如何在React Native导航器中禁用向后滑动手势

  28. 28

    如何在React Native中将组件正确导入到我的导航器中?

  29. 29

    如何设计React-Native Android应用程序的导航器结构?

热门标签

归档