React Native + react-native-router-flux: How to apply hideNavBar to only one <Scene/>?

╄→гoц情女王★ 提交于 2019-12-02 09:14:27

问题


In React Native using react-native-router-flux, I have two <Scene/> and when I apply hideNavBar to the first one, Login, it also applies to the second, Home even though they are on the same level. How can I apply hideNavBar to only one <Scene/>, Login?

const RouterWithRedux = connect()(Router)
const store = configureStore()

export default class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <RouterWithRedux>
          <Scene key='root'>
            <Scene component={Login} hideNavBar initial={true} key='login' title='Login'/>
            <Scene component={Home} key='home' title='Home'/>
          </Scene>
        </RouterWithRedux>
      </Provider>
    )
  }
}

回答1:


I am not sure about the reason. Probably it persists some state parameters accross diferent actions/PUSH. As a workaround, you can always try to be explicit: it worked for me.

const RouterWithRedux = connect()(Router)
const store = configureStore()

export default class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <RouterWithRedux>
          <Scene key='root'>
            <Scene component={Login} hideNavBar initial={true} key='login' title='Login'/>
            <Scene component={Home} hideNavBar={false} key='home' title='Home'/>
          </Scene>
        </RouterWithRedux>
      </Provider>
    )
  }
}

From that route on, NavBar is visible. It is appropriate if your Login only appears once throughout your scene flow.



来源:https://stackoverflow.com/questions/39611987/react-native-react-native-router-flux-how-to-apply-hidenavbar-to-only-one-sc

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!