Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Navigator.NavigationBar as a component #1256

Closed
ButuzGOL opened this issue May 13, 2015 · 4 comments
Closed

Navigator.NavigationBar as a component #1256

ButuzGOL opened this issue May 13, 2015 · 4 comments
Labels
Resolution: Locked This issue was locked by the bot.

Comments

@ButuzGOL
Copy link

Can't move NavBar as a component
Two examples

First -> Works

<Navigator
  renderScene={this.renderScene.bind(this)}
  navigationBar={
    <Navigator.NavigationBar routeMapper={NavigationBarRouteMapper} />
  }
/>

Second -> Not working

var NavBar = React.createClass({
  render() {
    return <Navigator.NavigationBar routeMapper={NavigationBarRouteMapper} />
  }
});

<Navigator
  renderScene={this.renderScene.bind(this)}
  navigationBar={
    <NavBar />
  }
/>
@ide
Copy link
Contributor

ide commented May 13, 2015

You probably need to pass forward all of the props. Try this:

 <Navigator.NavigationBar {...this.props} routeMapper={NavigationBarRouteMapper} />

Also if NavigationBar has any instance methods on it that the Navigator calls, you will need to forward those calls.

@nigeman
Copy link

nigeman commented May 13, 2015

@ide A quick silly question. But is it possible to not use:

<Navigator.NavigationBar
routeMapper={NavigationBarRouteMapper}
style={styles.navBar}
/>

in the Navigator navigationBar param? The reason is. I want to create a list of tabs and have access to the Navigator Context so I can use navigator.push without using the standard NavigationBarRouteMapper

@ide
Copy link
Contributor

ide commented May 13, 2015

You can override the props you don't want. For example if you add "style=[customStyle]" to the list of props it will override the forwarded style from {...this.props}.

@ButuzGOL
Copy link
Author

@ide Thanks works fine

@facebook facebook locked as resolved and limited conversation to collaborators May 29, 2018
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Jul 22, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Resolution: Locked This issue was locked by the bot.
Projects
None yet
Development

No branches or pull requests

4 participants