如何在登录和隐藏导航栏注册页面反应? [英] How to hide nav bar in login & signup page in react?

问题描述

我的路线是这样的:

<Route path="login" handler={Login}/><Route path="signup" handler={Signup}/><DefaultRoute handler={Home}/></路线>

我的应用容器:

var AppContainer = React.createClass({渲染:函数(){返回 (<div><标题/><RouteHandler/>

);}});

这里 Header 组件在所有页面中都被渲染.有没有办法避免登录和注册页面出现标题.

解决方案

这意味着你的组件 (AppContainer) 有状态.因此你应该有类似的东西:

var AppContainer = React.createClass({//状态管理在这里渲染:函数(){让 navHeader = this.state.isAuth ?<标题/>:'';返回 (<div>{导航标题}<RouteHandler/>

);}});

I have my routes like this:

<Route handler={AppContainer}>
 <Route path="login" handler={Login} />
 <Route path="signup" handler={Signup} />
 <DefaultRoute handler={Home} />
</Route>

My AppContainer:

var AppContainer = React.createClass({
  render: function () {
    return (
      <div>
        <Header />
        <RouteHandler />
      </div>
    );
  }
});

Here the Header component gets rendered in all the pages. Is there a way to avoid header in login and sign up page.

解决方案

This means that your component (AppContainer) has state. Therefore you should have something like:

var AppContainer = React.createClass({
  
  // state management in here
  
  render: function () {
    let navHeader = this.state.isAuth ? <Header /> : '';
    return (
      <div>
        {navHeader}
        <RouteHandler />
      </div>
    );
  }
});

这篇关于如何在登录和隐藏导航栏注册页面反应?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！