2015-06-27 2 views
3

меня NavigatorIOS в мое приложение и открыть новую страницу, как это и она отлично работает:Ручка NavigatorIOS ButtonPress в открытом компоненте

var createProgramRoute = { 
    component: CreateProgramPage, 
    title: "Create Program", 
    rightButtonTitle: "Save", 
    onRightButtonPress:() => { 
     // This part needs to be handled in CreateProgramPage component 
    }, 
    passProps: {}, 
    }; 
    props.navigator.push(createProgramRoute); 

CreateProgramPage класс, как этот

var CreateProgramPage = React.createClass({ 
    ... 

    _onRightButtonClicked() { 
    console.log("right button clicked") 
    } 

}); 

Так я хотите называть _onRightButtonClicked() из CreateProgramPage, когда нажимается RightButton of NavigatorIOS. Подобного примера нет. Все, что у них есть в примерах, вызывает pop() навигатора и все.

+1

пройти обработчик вниз к компоненту ребенка через опору –

+0

Не могли бы вы привести пример, пожалуйста? Потому что, если я передаю функцию с реквизитами, эта функция будет ссылкой на функцию предыдущей страницы. – eluleci

ответ

0

Мое предложение было бы использовать какую-то реализацию Flux с действиями, которые можно вызывать из любого места.

Мой личный фаворит Redux: https://github.com/gaearon/react-redux

Документах для предстоящей версии 1.0 действительно замечательно. http://gaearon.github.io/redux/

1

A. В исходном компоненте

this.props.navigator.push({ 
    title: 'title', 
    component: MyComponent, 
    rightButtonTitle: 'rightButton', 
    passProps: { 
     ref: (component) => {this.pushedComponent = component}, 
    }, 
    onRightButtonPress:() => { 
     this.pushedComponent && this.pushedComponent.foo(); 
    }, 
}); 

B. В толкнул компонента
заменить onRightButtonPress FUNC в толкаемой компоненте.

componentDidMount: function() { 
    // get current route 
    var route = this.props.navigator.navigationContext.currentRoute; 
    // update onRightButtonPress func 
    route.onRightButtonPress = () => { 
     this._onRightButtonClicked(); 
    }; 
    // component will not rerender 
    this.props.navigator.replace(route); 
}, 
Смежные вопросы