react-navigation中导航堆栈中的第一个屏幕答案

【问题标题】：First screen in navigation stack in react-navigationreact-navigation中导航堆栈中的第一个屏幕
【发布时间】：2019-07-27 21:59:21
【问题描述】：

是否可以检查 react-navigation 堆栈中的屏幕数量？我只需要在堆栈中的第一个屏幕的标题中显示徽标组件。

【问题讨论】：

【解决方案1】：

是的，你可以。你可以使用

let index = this.props.navigation.dangerouslyGetParent().state.index;

获取栈中的索引。如果索引为 0，那么您位于堆栈的第一个屏幕。

您可以阅读更多关于它的信息here。您的用例正是它的用途：

另一个很好的用例是找到活动的索引父路由列表中的路由。所以在堆栈的情况下，如果你是在索引 0 处，您可能不想呈现后退按钮，但如果您在列表中的其他位置，然后您将呈现一个后退按钮。

请记住确保调用返回有效值。

【讨论】：

【解决方案2】：

Andrew 解决方案对您来说很好，但是那些想要获得更新状态的人必须根据导航文档使用 useNavigationState：

navigation.dangerouslyGetState() 函数还返回当前导航状态。主要区别在于 useNavigationState 钩子会在值更改时触发重新渲染，而 navigation.dangerouslyGetState() 不会。

就这样使用：

const index = useNavigationState(state => state.index);

【讨论】：