javascript - Manipulate NavigatorIOS route on a component -

i'm trying build simple todo application in react native. it's composed of 2 views : 1 list of tasks, 1 input field (to add new one). navigation assured navigatorios , buttons on (which have been uibarbuttonitem uikit).

on list view, there add right button on navigator, on view text field, there button on left , done 1 on right. when clicking on done, should add new task content of text field.

problem is, buttons , actions defined when creating navigatorios component, , don't find way attach method defined in component button action.

as example, here navigatorios

class todolist extends component {      render() {         return (             <navigatorios                 ref="nav"                 style={styles.navbar}                 initialroute={{                     component: itemlist,                     title: 'todo list',                     rightbuttontitle: 'add',                     onrightbuttonpress: () => {                         this.refs.nav.push({                             title: 'add new task',                             component: addtodo,                             rightbuttontitle: 'done',                             onrightbuttonpress: () => {                                 console.log('done !');                             }                         });                     }                 }}             />         );     } } 

i don't put here 2 other components itemlist , addtodo there nothing interesting on it.

what need way make components communicate (like in delegation pattern) navigation component.

perhaps it's not possible, or totally wrong on paradigm used react native, feel free comment if not clear on question.

edit 05/26

actually, facebook team aware missing handle use case navigatorios component.

from eric vicenti (posted on february 3 2015) on an issue on github covers question.

currently best way create eventemitter in owner of navigatorios, can pass down children using route.passprops. child can mix in subscribable.mixin , in componentdidmount, can

this.addlisteneron(this.props.events, 'myrightbtnevent', this._handlerightbtnpress); 

it clear api needs improvement. actively working routing api in relay, , react-router, want navigatorios usable independently. maybe should add event emitter inside navigator object, child components can subscribe various navigator activity:

this.addlisteneron(this.props.navigator.events, 'rightbuttonpress', this._handlerightbtnpress); 

a. in initial component

this.props.navigator.push({     title: 'title',     component: mycomponent,     rightbuttontitle: 'rightbutton',     passprops: {         ref: (component) => {this.pushedcomponent = component},     },     onrightbuttonpress: () => {         // call func         this.pushedcomponent && this.pushedcomponent.myfunc();     }, }); 

b. in pushed component
replace onrightbuttonpress func in pushed component.

componentdidmount: function() {     // current route     var route = this.props.navigator.navigationcontext.currentroute;     // update onrightbuttonpress func     route.onrightbuttonpress =  () => {         // call func in pushed component         this.myfunc();     };     // component not rerender     this.props.navigator.replace(route); },