Лучший способ выделить текущую страницу в Rails 3? - применить класс CSS к ссылкам условно

Question

Для следующего кода:

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

Как применить класс CSS current с помощью вспомогательного метода current_page?‎?

Или, если есть какой-то другой лучший способ?

Answer 1

В app / helpers / application_helper.rb

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

По вашему мнению:

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

По сути, напишите простую обертку. Кроме того, вы можете расширить метод, чтобы разрешить применение дополнительных классов, добавив аргументы. Держит взгляды краткими / сухими. Или, не расширяя метод, вы можете просто выполнить простую интерполяцию строк, например, чтобы добавить дополнительные классы:

<%= link_to "All Posts", posts_path, class: "#{cp(posts_path)} additional_class" %>

Answer 2

В моем случае у меня есть много контроллеров с разделением имен, поэтому я хотел бы показать, если текущий вид также находится в пути к меню, я использовал решение Michael van Rooijen, а затем настраиваю для своего случая.

Helper

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

View

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

Теперь, если моя строка меню - / users, а моя текущая страница - / users / 10 / post, также для ссылки / users установлен «текущий» класс

Answer 3

Я ответил ответом Майкла и подправил помощника:

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. Почему это хорошо? Хорошо, если вы предоставите class с nil, он вообще не будет включать атрибут class в тег. Бонус!

Answer 4

Для того, чтобы вам не приходилось слишком много повторяться, постоянно проверяя current_page в методе link_to, вот специальный помощник, который вы можете использовать (введите 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>

С уважением.

Answer 5

Я бы сделал это так:

<%= link_to "Some Page", some_path, :class => current_page? ? "current" : "" %>

Answer 6

Я попытался объединить пару упомянутых техник с моими собственными потребностями.

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

В основном это позволяет вам использовать это так: create_nav_item("profile", profile_path), что приведет к: <li><a href="/profile" data-hover="Profile">Profile</a></li>,

или <li class="current"><a href="/profile" data-hover="Profile">Profile</a></li>, если это текущая страница.

Я не использовал request.url.include?(path), так как она всегда будет подсвечивать кнопку «Домой», и я не мог придуматьОбойтись безоговорочно.

Answer 7

Я думаю, что было бы неплохо, если бы вы генерировали целые link_to из вашего вспомогательного метода.Зачем повторять один и тот же код (:-) принцип СУХОГО)

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>

Надеюсь, это поможет!

Answer 8

Вариант решения Eric Boehs (самое надежное IMHO), если вы ссылаетесь непосредственно на объект класса (т.е. вы не показываете индекс) с добавленным помощником приложения:

def booking_link
 Booking.find(8)
end

Вы можете использовать следующее в представлении ( dd используется в контексте основания zurb)

<%= content_tag :dd, link_to(t('hints.book'), booking_link), class: active_class?(booking_path) %>-