Events are a great way of communicating between components, but they should be used carefully to avoid creating an unfathomable mess of interconnections. In this example, we’ll show how to use an event emitter to allow a React Native NavigatorIOS to talk to its child components.
First we pull in all of our requirements including the EventEmitter and Subscribable.
In our main top-level component, we create a new EventEmitter (in componentWillMount) to be available across the component, and then use passProps to pass it down to the Test component we specify for the navigator.
We also define a handler for the right button press, which emits a myRightBtnEvent with some dummy arguments when that button is pressed. Now, in the Test child component:
We add the Subscribable mixin, and the only other thing we need to do is listen out for the myRightBtnEvent being fired from the App component and hook miscFunction up to it. The miscFunction will be passed the dummy arguments from the App press handler so we can use those to set state or perform other actions.