在堆栈导航器标签上单击时渲染屏幕

使用TabNavigator制作了选项卡视图。这里是我使用的library。总计我有3个选项卡。所以初始选项卡加载&渲染罚款没有麻烦。但问题在于第三个标签。我在第三个标签组件中的每个方法中检查了console.log()。每个方法都在执行，但不显示结果（显示空白屏幕），直到我与之交互。当我开始与它交互时，只有数据是重新渲染的（我认为是这样）。在堆栈导航器标签上单击时渲染屏幕

我该如何解决这个问题？任何帮助？

感谢

来源

2017-07-24 Sivajee Battina

我用道具lazy真正的配置标签导航解决它。以下是我修改的代码。现在正在工作。

const TabView = TabNavigator({ 
         feed: { screen: Feed }, 
         info: { screen: Info }, 
         members: {screen: Members} 
         }, { 
         tabBarPosition: "top", 
         tabBarOptions: { 
          activeTintColor: "#4A90E2", 
          inactiveTintColor: "#4A4A4A", 
          style: { 
           backgroundColor: 'white', 
           height:56, 
           alignItems: 'center', 
           shadowColor: '#000000', 
           shadowOpacity: 0.1, 
           shadowRadius: 0, 
           shadowOffset: { 
            height: 2, 
            width: 1 
           } 

          }, 
          tabStyle: { 
           height: 40, 
          }, 
          labelStyle: { 
           fontSize:12, 
           fontFamily:'HelveticaNeue-Medium' 
          } 

         }, 
         lazy:true 
         });

来源

2017-07-24 13:56:24

lazy：true意味着直到点击后才显示背景中的选项卡。懒惰：false，切换标签将立即。如果在最后一个选项卡上显示的是ListView或FlatList/SectionList，则可以尝试在ListView上设置removeClippedSubviews = {false}，这可能有助于组件无法正确显示。 – hyb175

试试这个：使每个标签的数据作为一个单独的组件和你的标签内分别导入。例如：

<Tab1> 
<tab1 components/> 
</Tab1>

来源

2017-09-26 09:12:53

在堆栈导航器标签上单击时渲染屏幕

回答

相关问题