问题描述
这是我们的Bootstrap 3组件制作的Rails 4应用程序的_header.html.erb
:
<header class="navbar navbar-fixed-top navbar-inverse">
<div class="container">
<nav>
<div class="col-xs-4">
<%= link_to "APP NAME", root_path, id: "logo" %>
</div>
<div class="col-xs-4 text-center">
<ul class="nav navbar-nav navbar-center">
<li><%= link_to "Features", features_path %></li>
<li><%= link_to "Pricing", pricing_path %></li>
<li><%= link_to "Blog", '#' %></li>
</ul>
</div>
<div class="col-xs-4">
<ul class="nav navbar-nav navbar-right">
<% if current_user.try(:admin?) %>
<li><%= link_to "Users", users_path %></li>
<% end %>
<% if logged_in? %>
<li><%= link_to "Dashboard", current_user %></li>
<li><%= link_to "Settings", current_user %></li>
<li><%= link_to "Log out", logout_path, method: "delete" %></li>
<% else %>
<li><%= link_to "Log in", login_path %></li>
<li><%= link_to "Sign up", signup_path %></li>
<% end %>
</ul>
</div>
</nav>
</div>
</header>
如您所见,这将有条件地显示一个导航栏,具体取决于当前用户是注销,登录还是以管理员身份登录.
但是,我们想知道如何在不同页面上显示不同的导航栏.
例如,在所有公共页面(主页,功能,价格,博客,帮助等)上,我们要显示Features
,Pricing
和& Blog
链接(无论用户是否登录),但是在应用程序的内部页面(仪表板,设置等)上,我们希望删除这些链接.
为了使事情更清楚,我们所谓的公共页面实际上是我们的static_pages
,它依赖于我们的StaticPages#Controller
,而内部应用程序页面(例如仪表板和设置)依赖于我们的Users#Controller
.
我们如何实现这一目标?我们需要创建一个新的_header.html.erb
局部文件吗?
是否有特定的Rails方式?
您可以将导航栏的每个变体放入其自己的部分中,并使用content_for
.
在您的应用程序布局中,您可以具有检查是否应渲染特定导航栏的逻辑,如下所示:
<% if content_for?(:navbar) %>
<%= yield(:navbar) %>
<% else %>
# code for default navbar
<% end %>
在视图中,您需要不同的导航栏
<% content_for :navbar do %>
<%= render 'nav_bar_variation_one' %>
<% end %>
和
<% content_for :navbar do %>
<%= render 'nav_bar_variation_two' %>
<% end %>
Here is the _header.html.erb
of our Rails 4 app, made with Bootstrap 3 components:
<header class="navbar navbar-fixed-top navbar-inverse">
<div class="container">
<nav>
<div class="col-xs-4">
<%= link_to "APP NAME", root_path, id: "logo" %>
</div>
<div class="col-xs-4 text-center">
<ul class="nav navbar-nav navbar-center">
<li><%= link_to "Features", features_path %></li>
<li><%= link_to "Pricing", pricing_path %></li>
<li><%= link_to "Blog", '#' %></li>
</ul>
</div>
<div class="col-xs-4">
<ul class="nav navbar-nav navbar-right">
<% if current_user.try(:admin?) %>
<li><%= link_to "Users", users_path %></li>
<% end %>
<% if logged_in? %>
<li><%= link_to "Dashboard", current_user %></li>
<li><%= link_to "Settings", current_user %></li>
<li><%= link_to "Log out", logout_path, method: "delete" %></li>
<% else %>
<li><%= link_to "Log in", login_path %></li>
<li><%= link_to "Sign up", signup_path %></li>
<% end %>
</ul>
</div>
</nav>
</div>
</header>
As you can see, this conditionally displays a navigation bar, depending on whether the current user is logged out, logged in or logged in as admin.
However, we are wondering how we could display a different navigation bar on different pages.
For instance, on all public pages (home, features, pricing, blog, help, etc.), we would like to display the Features
, Pricing
& Blog
links (whether the user is logged in or not) but on the inner pages of the app (dashboard, settings, etc) we would like to remove these links.
EDIT: to make things clearer, what we call the public pages are actually our static_pages
, which rely on our StaticPages#Controller
, while the inner app pages such as dashboard and settings rely on our Users#Controller
.
How can we achieve this? Do we need to create a new _header.html.erb
partial?
Is there a particular Rails way to do that?
You could put each variation of the navbar in it's own partial and make use of content_for
.
In your application layout you could have logic that checks if a specific navbar should be rendered, like this:
<% if content_for?(:navbar) %>
<%= yield(:navbar) %>
<% else %>
# code for default navbar
<% end %>
And inside your views, where you want the different navbars
<% content_for :navbar do %>
<%= render 'nav_bar_variation_one' %>
<% end %>
and
<% content_for :navbar do %>
<%= render 'nav_bar_variation_two' %>
<% end %>
这篇关于Rails 4/Bootstrap 3:如何在不同页面上显示不同的导航栏?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!