小编Ego*_*gor的帖子

我正在努力使一排伸展以填补剩余的可用高度.我尝试添加h-100到行类,但这会在屏幕底部产生一个空白区域.必须有办法做到这一点,但我完全难过..这是我的代码:

<div class="container-fluid h-100">
  <div class="row justify-content-center h-100">
    <div class="col-4 bg-red">
      <div class="h-100">
        <div class="row justify-content-center bg-purple">
          <div class="text-white">
            <div style="height:200px">ROW 1</div>
          </div>
        </div>
        <div class="row justify-content-center bg-blue">
          <div class="text-white">ROW 2</div>
        </div>
      </div>
    </div>
    <div class="col-8 bg-gray"></div>
  </div>
</div>

codepen:https://codepen.io/ee92/pen/zjpjXW/ ？ edit = 1100

我想让蓝色行(ROW 2)填满所有红色空间.有什么建议？

谢谢

我是react-router的新手（通常是客户端路由），所以我可能会想到这一切都是错误的。如果是这样的话，请提前抱歉。

基本上只想实现3条简单的规则：

• 如果没有用户，请重定向到“ /登录”
• 否则，如果路由不存在，请重定向到“ /”（根）
• 否则让用户转到请求的路线

我跟踪中的用户this.state.user。我当前的路由器似乎遵循前2条规则，但是只允许经过身份验证的用户查看主页（“ / profile”重定向到“ /”），所以我知道我做错了事，但无法弄清楚。

 <Router>
    {this.state.user ? (
      <Switch>
        <Route path="/" exact component={Home}/>
        <Route path="/profile" exact component={Profile}/>
        <Route render={() => (<Redirect to="/" />)}/>
      </Switch>
    ) : (
      <Switch>
        <Route path="/login" exact component={Login}/>
        <Route render={() => (<Redirect to="/login" />)}/>
      </Switch>
    )}
 </Router>

任何建议表示赞赏。谢谢