diff --git a/src/NavBar.js b/src/NavBar.js index eea926d48..2ae51f2f5 100644 --- a/src/NavBar.js +++ b/src/NavBar.js @@ -70,8 +70,7 @@ export default class NavBar extends React.Component { {state.children.map(this._renderTitle, this)} - {this._renderBackButton()} - {this._renderLeftButton()} + {this._renderLeftButton() || this._renderBackButton()} {this._renderRightButton()} ); @@ -106,41 +105,38 @@ export default class NavBar extends React.Component { } _renderRightButton() { - const state = this.props.navigationState; - const childState = this.props.navigationState.children[this.props.navigationState.index]; - if (childState.onRight && childState.rightTitle){ - return ( - - {childState.rightTitle} - - ); - } - if (state.onRight && state.rightTitle){ - return ( - - {state.rightTitle} - - ); + function tryRender(state) { + if (state.onRight && state.rightTitle) { + return ( + + {state.rightTitle} + + ); + } + if ((!!state.onRight ^ !!state.rightTitle)) { + console.warn('Both onRight and rightTitle must be specified for the scene: ' + state.name) + } } + const state = this.props.navigationState; + return tryRender(state) || tryRender(state.children[state.index]); } _renderLeftButton() { - const state = this.props.navigationState; - const childState = this.props.navigationState.children[this.props.navigationState.index]; - if (childState.onLeft && childState.leftTitle){ - return ( - - {childState.leftTitle} - - ); - } - if (state.onLeft && state.leftTitle){ - return ( - - {state.leftTitle} - - ); + function tryRender(state) { + if (state.onLeft && state.leftTitle){ + return ( + + {state.leftTitle} + + ); + } + if ((!!state.onLeft ^ !!state.leftTitle)) { + console.warn('Both onLeft and leftTitle must be specified for the scene: ' + state.name) + } } + const state = this.props.navigationState; + return tryRender(state) || tryRender(state.children[state.index]); } _renderTitle(childState: NavigationState, index:number) {