ruby-在Rails 3中突出显示当前页面的最佳方法? -有条件地将CSS类应用于链接

对于以下代码:

<%= link_to "Some Page", some_path %>

如何使用current_page?‎帮助程序方法应用CSS类current

还是有其他更好的方法可用?

8个解决方案
89 votes

在app / helpers / application_helper.rb中

def cp(path)
  "current" if current_page?(path)
end

在您看来:

<%= link_to "All Posts", posts_path, class: cp(posts_path) %>

基本上围绕它编写一个简单的包装。 另外,您可以扩展该方法,以允许通过添加参数来应用其他类。 保持视图简洁/干燥。 或者,不扩展方法,您可以像这样添加简单的类就可以进行简单的String插值:

<%= link_to "All Posts", posts_path, class: "#{cp(posts_path)} additional_class" %>
Michael van Rooijen answered 2020-02-21T13:50:38Z
18 votes

在我的情况下,我有很多命名空间控制器,这就是为什么我想显示当前视图是否也在菜单路径中,我曾经使用Michael van Rooijen的解决方案,然后针对我的情况进行了自定义。

帮手

def cp(path)
  "current" if request.url.include?(path)
end

视图

<%= link_to "All Posts", posts_path, class: cp(posts_path) %>

现在,如果我的菜单栏是/ users,而我的当前页面是/ users / 10 / post,则链接/ users也设置为“ current”类

rderoldan1 answered 2020-02-21T13:51:11Z
10 votes

我摆脱了迈克尔的回答,并调整了助手:

def active_class?(*paths)
  active = false
  paths.each { |path| active ||= current_page?(path) }
  active ? 'active' : nil
end

使用方法如下:

<%= link_to "Bookings", bookings_path, class: active_class?(bookings_path) %>

如果有一个选项卡可以由多个视图呈现,则可以传递多个路径到它:

<%= content_tag :li, class: active_class?(bookings_path, action: 'new') %>

这样做的好处是,如果条件为false,它将插入nil。这为什么很好? 好吧,如果您提供classnil,则根本不会在标签上包含class属性。 奖金!

Eric Boehs answered 2020-02-21T13:51:45Z
4 votes

为了不必通过重复检查http://example.com/dashboard方法中的current_page来重复自己的事情,这里提供了一个自定义助手,您可以使用它(将其放入app/views/helpers/application_helpers.rb

def link_to_active_class(name, active_class_names, options = {}, html_options = {}, &block)
  html_options[:class] = html_options[:class].to_s + active_class_names if current_page?(options.to_s)
  link_to name, options, html_options, &block
end

用法示例:

<div> <%= link_to_active_class('Dashboard', 'bright_blue', dashboard_path, class: 'link_decor') </div>

如果您使用的是http://example.com/dashboard,则应返回:

<div> <a href='/dashboard' class='link_decor bright_blue'>Dashboard</a> </div>

问候。

Nik So answered 2020-02-21T13:52:21Z
3 votes

我会这样:

<%= link_to "Some Page", some_path, :class => current_page? ? "current" : "" %>
thoferon answered 2020-02-21T13:52:41Z
0 votes

Eric Boehs解决方案的一种变体(最强大的一种IMHO),如果您直接链接到该类的对象(即您不显示索引),则使用添加的应用程序帮助程序:

def booking_link
 Booking.find(8)
end

您可以在视图中使用以下命令(在zurb Foundation的上下文中使用dd)

<%= content_tag :dd, link_to(t('hints.book'), booking_link), class: active_class?(booking_path) %>-
Jerome answered 2020-02-21T13:53:06Z
0 votes

我认为,如果您通过助手方法生成整个link_to,那将是个好主意。 为什么要重复相同的代码(:-) DRY原理)

def create_link(text, path)
  class_name = current_page?(path) ? 'current' : 'any_other_class'

  link_to text, path, class: class_name
end

现在您可以像这样使用:

<%= create_link 'xyz', any_path %>(视图中)将呈现为<a href="/any" class="current">xyz</a>

希望能帮助到你!

Dusht answered 2020-02-21T13:53:39Z
0 votes

我尝试将两种提到的技术与我自己的需求结合起来。

def current_page(path)
  'current' if current_page?(path)
end

def create_nav_link(string, path, method)
  link_to string, path, data: { hover: string }, method: method
end

def create_nav_item(string, path, method = nil)
  content_tag :li, create_nav_link(string, path, method), class: current_page(path)
end

基本上,您可以像这样使用它:request.url.include?(path)将导致:<li><a href="/profile" data-hover="Profile">Profile</a></li>

request.url.include?(path)(如果这是当前页面)。

我没有使用request.url.include?(path),因为它也总是突出显示“主页”按钮,并且我想不到目前为止尚无解决方法。

Glubi answered 2020-02-21T13:54:13Z
translate from https://stackoverflow.com:/questions/8552763/best-way-to-highlight-current-page-in-rails-3-apply-a-css-class-to-links-con