NavigatorIOS ButtonPress handle in opened component
I have NavigatorIOS in my app and I open a new page like this and it works fine:
var createProgramRoute = {
component: CreateProgramPage,
title: "Create Program",
rightButtonTitle: "Save",
onRightButtonPress: () => {
// This part needs to be handled in CreateProgramPage component
},
passProps: {},
};
props.navigator.push(createProgramRoute);
The CreateProgramPage class is like this
var CreateProgramPage = React.createClass({
...
_onRightButtonClicked() {
console.log("right button clicked")
}
});
So I want to call _onRightButtonClicked () CreateProgramPage when I right click the NavigatorIOS. There is no such example. Everything they have in the examples calls pop () of the navigator and that's it.
+3
source to share
2 answers
and. In the original component
this.props.navigator.push({
title: 'title',
component: MyComponent,
rightButtonTitle: 'rightButton',
passProps: {
ref: (component) => {this.pushedComponent = component},
},
onRightButtonPress: () => {
this.pushedComponent && this.pushedComponent.foo();
},
});
C. In the clicked component,
replace the onRightButtonPress function in the clicked component.
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);
},
+1
source to share
My suggestion was to use some kind of Flux implementation with Actions that can be called from anywhere.
My personal favorite is Redux: https://github.com/gaearon/react-redux
The docs for the upcoming 1.0 release are really great. http://gaearon.github.io/redux/
0
source to share