React-navigation：检测新屏幕是否完全聚焦答案

【问题标题】：React-navigation: detect new screen is fully focusedReact-navigation：检测新屏幕是否完全聚焦
【发布时间】：2018-04-25 17:03:29
【问题描述】：

在当前版本的 react-navigation 中，有两种方法可以检查屏幕是否获得焦点，方法是 (1) 调用屏幕属性 navigation 的函数 isFocused，或 (2) 将组件挂接到withNavigationFocused 并检索道具isFocused。

但是，当导航开始时，这两种方法总是返回 true。就我而言，我只需要在屏幕转换结束时触发一些东西，即新屏幕完全聚焦。这是为了处理重渲染的孩子，例如相机或地图，应该在屏幕过渡后渲染，以避免缓慢的过渡动画。

知道如何实现吗？

【问题讨论】：

【解决方案1】：

您可以尝试订阅导航生命周期事件，如docs 中所述：

const didFocusSubscription = this.props.navigation.addListener(
  'didFocus',
  payload => {
    console.debug('didFocus', payload);
  }
);

repo 中的另一个示例用法

【讨论】：

工作得很好！感谢您的解决方案
这对我不起作用。我正在尝试使用它来触发动画，部分问题是我不能使用 Animated 在我的情况下，我只能通过 LayoutAnimation 来实现。 didFocus 回调在渲染函数之后但在内容实际出现在屏幕上之前被调用。我通过在其中放置一个调试器语句来检查这一点 - 执行在空白屏幕期间停止。结果，LayoutAnimation 被应用到整个屏幕，而不仅仅是我的特定动画。任何想法如何推迟回调直到屏幕实际出现？
@dols3m LayoutAnimation 始终适用于整个屏幕。
@vonovak 据我所知，它适用于调用 configureNext 后发生的任何重新渲染。如果重新渲染整个屏幕 - 是的，它适用于整个屏幕。但是，我试图确保在整个屏幕可见后调用它，以便动画仅适用于我之后更新的元素。更具体地说，我正在尝试使用弹簧动画调整标题的大小。相反，整个屏幕都映入眼帘。
对于 4.x 版本的 react-navigation 库，您可以收听 focus 事件而不是 willFocus 或 didFocus 事件。