React Native: Using a callback with Navigator didFocus event

Question

NOTE: I managed to solve the problem without using a didFocus event using EventEmitters and subscribables. Because that solution doesn't answer this particular question (how to use didFocus Events), I posted the solution on a different question.

I have a ListView with a _refreshData method which is called on componentDidMount. The method does a simple query to the realm database and the ListItems are refreshed accordingly:

In my <FooListScreen> Component

componentDidMount(){
    this._refreshData();
}

_refreshData(){

    this.setState({
        dataSource: this.state.dataSource.cloneWithRows(realm.objects('Foo'))
    })

}

I'd like to be able to call _refreshData() after saving a new instance of 'Foo" from a form component which I've pushed onto the Navigator stack. After the new Foo is saved, I'd do a navigator.pop() back to to the <FooListScreen> component and rerender the ListView somehow. After some reading, it seems like the best practice is to use a callback with the navigator's didFocus event, but I couldn't find a helpful code example. Any ideas?

My <MyNavigator> component:

export class MyNavigator extends Component {
    constructor(props) {
        super(props);
        this._renderScene = this._renderScene.bind(this);
    }
    _renderScene(route, navigator) {
        var Component = route.component;
        return (
            <Component {...route.props} navigator={navigator} route={route} />
        );
    }
  render() {
    const routes = [
        {component: FooListScreen, index: 0},
        {component: NewFooScreen, index: 1}
    ];

    return (
        <Navigator
        initialRoute={routes[0]}
        initialRouteStack={routes}
        renderScene={this._renderScene}
        navigationBar={
              <Navigator.NavigationBar
              routeMapper={{
         LeftButton: (route, navigator, index, navState) =>
          { 
            if(route.index === 0){
                return null
            } else {
                return (
              <TouchableHighlight onPress={() => navigator.pop()}>
              <Text>Back</Text>
              </TouchableHighlight>
              ); 
            }
          },
         RightButton: (route, navigator, index, navState) =>
           {
           if (route.index === 0){
            return (
              <TouchableHighlight onPress={() => navigator.push({
                component: NewFooScreen
              })}>
              <Text>New Foo!</Text>
              </TouchableHighlight>
            )
           } else {
            return null;
           } 
         },
         Title: (route, navigator, index, navState) =>
           { return null; },
       }} />
    } /> );
  }
}

In the <NewFooScreen> Component:

    _onPressButton(){
        realm.write(()=> {
          //Create a new Foo and save to realm db
            realm.create('Foo', {
                    name: this.state.fooName
            });

    //Somehow call _refreshData() in the FooList Component?? 
    //Through the Navigator? Using didFocus?

         this.props.navigator.pop();
    }