it-swarm.com.ru

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

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

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

Как мне применить класс css current, используя вспомогательный метод current_page?‎?

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

47
Jacob

В 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" %>
89
Michael van Rooijen

В моем случае у меня есть много контроллеров с разделением имен, поэтому я хотел бы показать, что текущий вид также находится в пути к меню, я использовал решение 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» 

18
rderoldan1

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

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 в тег. Бонус!

10
Eric Boehs

Чтобы не повторять себя слишком долго, постоянно проверяя страницу 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>

С уважением.

4
Nik So

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

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

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

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), так как она всегда будет подсвечивать кнопку «Домой», и я не мог придумать какой-либо обходной путь.

0
Glubi

Я думаю, если было бы хорошей идеей, если вы генерируете целый 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>

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

0
Dusht

Вариант решения 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) %>-
0
Jerome