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

[NavigatorIOS] SetState does not rerender NavigatorIOS component (w/ example repo) #1403

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

Comments

@the4dpatrick
Copy link

Here is a repo showing the bug https://github.com/the4dpatrick/react-native-bug-example

I am trying to toggle NavigatorIOS on and off based on the prop navigationBarHidden set to a state value.

    return (
      <NavigatorIOS
        style={styles.container}
        initialRoute={initialRoute}
        navigationBarHidden={this.state.hideNavbar}
        configureScene={() => Navigator.SceneConfigs.PushFromRight}/>
    );

I pass along a method to child components that passes the parent's context and toggle the state value.

  toggleNavigation() {
    this.setState({
      hideNavbar: !this.state.hideNavbar
    });
  }
     initialRoute = { 
        component: ScreenWithMenu, 
        title: 'Screen', 
        passProps: {
          toggleNavigation: this.toggleNavigation.bind(this)
        } 
      };

Inside the sidemenu, I am calling this.props.toggleNavigation() onPress. This correctly toggles the navbar when initially hidden, but when you press onLeftButtonPress, the navbar does not toggle off.

  navigateToThemes() {
    var Themes = require('../Screens/Themes');

    this.props.menuActions.close();
    this.props.toggleNavigation();
    this.props.navigator.push({
      component: Themes,
      title: 'Themes',
      leftButtonTitle: 'Back',
      onLeftButtonPress: () => {
        this.props.navigator.pop();
        this.props.toggleNavigation();
      },
      passProps: { navigator: this.props.navigator }
    })
  }

Here is the start of the IRC chat on this bug https://botbot.me/freenode/reactnative/2015-05-26/?msg=40122019&page=1

@the4dpatrick the4dpatrick changed the title SetState does not rerender component (w/ example repo) SetState does not rerender NavigatorIOS component (w/ example repo) May 26, 2015
@pwmckenna
Copy link
Contributor

I suspect you're running into the same issue I did (though I wanted to change the initial routes). #1300

I believe re-rendering the navigator is a no-go for the time being.

@ericvicenti thoughts?

@brentvatne
Copy link
Collaborator

NavigatorIOS is not currently owned by anyone on the React Native team because it is not used internally at Facebook, so this one is up to us to figure out.

The reason this isn't happening is that this property is only applied on viewDidAppear - so you will see it work when you change routes, but not when you trigger it within the same route. If you'd like to submit a patch, you're welcome to!

@brentvatne
Copy link
Collaborator

@the4dpatrick - this commit on your project fixes the problem, but I think it's a little hacky. If you want to clean it up into a nicer solution that would be great. Feel free to clone that repo and try it - I included the node_modules directory in it because I made changes directly to the React Native source

@brentvatne brentvatne changed the title SetState does not rerender NavigatorIOS component (w/ example repo) [NavigatorIOS] SetState does not rerender NavigatorIOS component (w/ example repo) May 28, 2015
@brentvatne
Copy link
Collaborator

This is a dup of #846

drtangible added a commit to bjornco/react-native that referenced this issue Feb 22, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue Feb 22, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue Mar 8, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue Mar 9, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue Mar 18, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue Apr 14, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue May 18, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue Jul 4, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue Aug 12, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue Nov 7, 2016
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
drtangible added a commit to bjornco/react-native that referenced this issue Feb 16, 2017
* Approach borrowed from: facebook#1403 (comment)

* Would need to follow similar pattern to update other navigation / nav bar props on resetTo / replace,
  but want to limit the changes from RN master for now.
@facebook facebook locked as resolved and limited conversation to collaborators May 31, 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