How to add subscriptions on defaultNavigationOptions

Question

I've came across this solution, trying to subscribe to updates to navigation lifecycle

Navigator.js

const App = createStackNavigator(
  {
    screen1: { screen: MainScreen },
    screen2: { screen: SecondaryScreen },
  },
  {
    cardStyle: {
      backgroundColor: 'transparent'
    }
  }
);

const MainNavigator = createAppContainer(App);

export default MainNavigator;

I'm wondering if it's possible to subscribe to events in this navigator file? Or I have no other options but to subscribe at each and every individual screens?

Answer 1

you can add listener for each screen like this

constructor(props) {
        super(props);
        this.props.navigation.addListener(
            'willFocus',//event name
            payload => {
                //do your work here
            }
        );
    }

other event names:'onDidFocus', 'onWillBlur' ,'onDidBlur'

reference