阻止/禁用TabNavigator中的选项卡 - react-navigation

Question

我有一个TabNavigator，如图所示。 Header Image

我正在使用TabNavigator创建这些选项卡，如下所示。

const Tab_Navigator = TabNavigator({ 
    First:{ 
     screen: First, 
    }, 
    Second:{ 
     screen: Second, 
    }, 
    Third:{ 
     screen: Third, 
    }, 

现在我想阻止/禁用“Second”和“Third”选项卡。它应该是可见的，但不应该能够导航到它们。

我试图阻止这些标签here但我想我错过了一些东西。我的尝试：

Tab_Navigator.router.getStateForAction = (action, state) => { 
if(action.type === NavigationActions.navigate({ routeName: "Second"}) || 
    action.type === NavigationActions.navigate({ routeName: "Third"})) 
{ 
    return null; 
} 

return Byte.router.getStateForAction(action, state); 

};

Answer 1

在这种情况下，action.type =“Navigation/NAVIGATE”和action.routeName是您的选项卡的名称。这与ReactNavigation Routers示例有点不同。下面应该工作：

const defaultGetStateForAction = Tab_Navigator.router.getStateForAction; 

Tab_Navigator.router.getStateForAction = (action, state) => { 
    if ((action.type === NavigationActions.NAVIGATE) && 
    (action.routeName === "Second" || action.routeName === "Third") { 
    return null; 
    } 

    return defaultGetStateForAction(action, state); 
}; 

编辑：这里是在Chrome调试器的图像停在一个非常相似的一段代码（标签名称是不同的）断点，但它表明了“行动值“对象被传入这个函数。