React Native 中 StackNavigation 内的 TabBar

Posted 2023-02-19

【中文标题】React Native 中 StackNavigation 内的 TabBar

【英文标题】：TabBar inSide the StackNavigation in React Native

【发布时间】：2018-01-25 08:07:36

【问题描述】：

我将使用StackNavigation 进行Push 和Pop 及其参数。它的工作正常。但是现在我想在 StackNavigation 之后实现一些屏幕 TabBar，知道如何在 StackNavigation 之后使用 TabBar。

注意：我想实现自定义 TabBar。

请帮帮我。

【问题讨论】：

你可以使用 react-navigation 包中的 TabNavigator

但它是默认的 TabBar。我想定制。

您可以根据自己的需要自定义。

提供你尝试了什么？

【参考方案1】：

你可以做类似的事情

let StackWithTabs1 = StackNavigator( // stackNavigator inside the tabNavigator
  Screen3:
    screen: Screen3
  
  ,Screen4:
    screen: Screen4
  
);

let StackWithTabs2 = StackNavigator( // stackNavigator inside the tabNavigator
      Screen5:
        screen: Screen5
      
      ,Screen6:
        screen: Screen6
      
    );

let tab_bar = TabNavigator(
      StackWithTabs1 : 
        screen: StackWithTabs1 // Calling the stackNavigators that going to go inside the tabNavigator
      ,
      StackWithTabs2 : 
        screen: StackWithTabs2 
      
    );

let InitialStackNavigator = StackNavigator(
  Screen1: 
    screen: Screen1
  ,
  Screen2: 
    screen: Screen2
  ,
  tabBar: 
    screen: tab_bar // Calling the tabNavigator, wich contains the other stackNavigators
  
);

只需声明您的tabNavigator 和它的stackNavigators 分开，然后在主stackNavigator 上调用它们。

【讨论】：

嗨，我想在选择时重新加载选项卡。我怎样才能实现。\

不幸的是，我有同样的问题：/