React-Native-Navigation TabNavigator换屏功能？答案

【问题标题】：React-Native-Navigation TabNavigator screen change function?React-Native-Navigation TabNavigator换屏功能？
【发布时间】：2017-05-22 00:57:52
【问题描述】：

我在我的应用程序中使用 react-native-navigation 选项卡导航器，在我的一个屏幕上，我有一个可以播放音乐的按钮。但是，如果您按下按钮然后导航到不同的屏幕（使用标签栏），音乐将继续播放。当用户导航到另一个屏幕时，我正在尝试找到一种让音乐停止的方法。

有没有类似于 componentDidUnmount() 方法的东西可以在屏幕变化时调用？

【问题讨论】：

标签： react-native navigation tabnavigator

【解决方案1】：

从v1.0.0-beta.28 开始，您现在可以在屏幕中订阅一些选项卡事件（willFocus、didFocus、willBlur、didBlur）：

componentDidMount() {
this._sub = this.props.navigation.addListener(
    'willFocus',
    this.yourCallback
  );
}

componentWillUnmount() {
  this._sub.remove();
}

【讨论】：

【解决方案2】：

这里有两个选项（我知道），都不是很好。

首先，您可以use Redux to to manage your navigator's state，当标签发生变化时，聆听该变化，当相关标签不再处于活动状态时停止播放音乐。

其次，您可以尝试使用onNavigationStateChange，但这对我来说真的很老套——而且我不确定它的实际效果如何。

【讨论】：

是的，我不知道在这种情况下如何使用 onNavigationStateChange。看起来像redux！感谢您的意见