React-Native navigation.addListener не является функцией

Question

Есть ли способ, как я могу это исправить без использования приставки?

Это происходит только на iOS, на андроиде AddListener прекрасно работает без него.

У меня есть компонент, и я вызываю props.navigation.addListener для функции componentDidMount.Некоторый код, помогающий понять, где именно он ломается:

componentDidMount(){
    var _this = this;
    this.willBlurListener = this.props.navigation.addListener('willBlur', () => {
        _this.timer.clearTimeout();
    });
    this.willFocusListener = this.props.navigation.addListener('willFocus', () => {
        _this._action();
    });
    AppState.addEventListener('change', this._handleAppStateChange);
}

А потом я использую такой компонент:

<Inactivity name='SomeNameView' navigation={ this.props.navigation }>
    {this.renderDetails()}              
</Inactivity>

Answer 1

Можете ли вы попробовать использовать функцию withNavigation, она возвращает HOC с навигацией в ней, поэтому вам не нужно переходить от родительского компонента к дочернему:

Я создал простойприложение, которое использует эту концепцию, которая, вероятно, может помочь вам:

import React from 'react';
import {
  View,
  Text,
  Button,
} from 'react-native';
import {
  createStackNavigator,
  withNavigation,
} from 'react-navigation';


class SomeComponent extends React.Component {
  componentDidMount() {
    this.willBlurListener = this.props.navigation.addListener('willBlur', () => {
      this.someAction();
    })
  }

  someAction() {
    console.log('Some action is called!');
  }

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

  render() {
    return (
        <View>
          <Text>Some Component</Text>
          <Button
              title={'Open settings'}
              onPress={() => this.props.navigation.navigate('Settings')}
          />
        </View>
    )
  }
}

const SomeComponentWithNavigation = withNavigation(SomeComponent);

class HomeScreen extends React.Component {
  static navigationOptions = {
    title: 'Home'
  }

  render() {
    return (
        <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
          <SomeComponentWithNavigation/>
          <Text>Welcome to home screen!</Text>
        </View>
    )
  }
}

class SettingsScreen extends React.Component {
  static navigationOptions = {
    title: 'Settings'
  }

  render() {
    return (
        <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
          <Text>Welcome to settings screen!</Text>
        </View>
    )
  }
}

export default createStackNavigator(
    {
      Home: HomeScreen,
      Settings: SettingsScreen,
    },
);