Question

基本上，我有很多看起来像这样的代码：

link_to t('.profile'), business_path(@business), class: '#{'active' if current_page? business_path(@business)}'

这不是很干。

我想知道是否有人知道修改link_to帮助程序本身的好方法，以自动将“活动”类添加到当前页面的所有链接。

如果有帮助，我愿意使用HAML或SLIM。

Answer 1

当您可以在current_page?哈希中指定自定义class名称时，我使用build in helper html_options编写了简单的帮助方法。

def active_link_to(name = nil, options = nil, html_options = nil, &block)
  active_class = html_options[:active] || "active"
  html_options.delete(:active)
  html_options[:class] = "#{html_options[:class]} #{active_class}" if current_page?(options)
  link_to(name, options, html_options, &block)
end

示例（当您在root_path路线上时）：

<%= active_link_to "Main", root_path %>
# <a href="/" class="active">Main</a>

<%= active_link_to "Main", root_path, class: "bordered" %>
# <a href="/" class="bordered active">Main</a>

<%= active_link_to "Main", root_path, class: "bordered", active: "disabled" %>
# <a href="/" class="bordered disabled">Main</a>

Answer 2

这是一个已解决的问题，只需使用active_link_to gem即可。您的示例简化为：

= active_link_to t('.profile'), business_path(@business)

Answer 3

这是编写包装link_to的自己的帮助程序的好例子。在您的application_helper.rb中，您可以编写一个方法active_link_to，该方法使用与link_to + current_page相同的参数，然后像上面一样调用link_to。

Answer 4

我遇到了同样的要求，这是我的解决方案。

在ApplicationHelper

中创建方法

def active_class(link_path)
    current_page?(link_path) ? "active" : ""
end

在你的观点中：

    <li class="<%= active_class('/') %>">
      <%= link_to 'HOME', root_path %>
    </li>

Answer 5

这是我使用的助手。我添加了一个可选的“match_text”参数以增加灵活性（例如，如果我想在实际请求路径是链接目标的子页面时将链接标记为活动。）

def link_to_active(text, destination, options = {})
  match_text = options.delete(:match_text)

  classes = options[:class].present? ? options[:class].split(" ") : []
  classes << "active" if request.fullpath.downcase == destination.downcase || (match_text && request.fullpath.downcase.include?(match_text.downcase))

  options = options.except(:class)
  options.merge!(:class => classes.join(" ")) unless classes.empty?

  link_to(text, destination, options)
end

Answer 6

我和@egyamado做的一样。我也需要使用AwesomeIcons，所以：

助手：

def active_class?(link_path)
    'active' if current_page?(link_path)
end

这是我的观点：

 <%= link_to my_controller_page_path,
    :title => "My Controller Page",
    :class => "other_name_class #{active_class?(my_controller_page_path)}" do  %>
                <i class="fa fa-fighter-jet"></i>&nbsp;My Controller Page
<%end%>

在另一种链接中，例如在Li内。

#In this case I put a extra validation in root_path
<li class="nav-class <%=active_class?(my_controller_page_path)%> <%='active' if current_page?(root_path) %>">
  <%= link_to my_controller_page_path,
      :title => "Page 1",
      :class => "other_name_class" do  %>
      Page 1
  <%end%>
</li>
<li class="nav-class <%=active_class?(my_controller_page_2_path)%>">
  <%= link_to my_controller_page_2_path,
      :title => "Page 2",
      :class => "other_name_class" do  %>
      Page 2
  <%end%>
</li>

对我有用。

Answer 7

根据 rails 6.1 现在我们有 html 类名的帮助程序

助手示例

class_names("foo", "bar")
 # => "foo bar"
class_names({ foo: true, bar: false })
 # => "foo"
class_names(nil, false, 123, "", "foo", { bar: true })
 # => "123 foo bar"

你可以这样使用它

<%= link_to 'Home', root_path, class: class_names('nav-link', { active: current_page?(root_path) }) %>

它会产生这样的html

<a class="nav-link active" href="/">Home</a>

文档是 here

Answer 8

这是我处理这个问题的自定义方法。

  def active_link_to(name = nil, options = nil, html_options = nil, &block)
    if current_page?(options)
      active_class = html_options[:active_class] ? html_options[:active_class] : 'has-text-danger'
      html_options[:class] << "#{html_options[:class]} #{active_class}"
    end

    link_to(name, options, html_options, &block)
  end

html_options[:active_class] 是自定义哈希。

现在我可以动态更改活动链接的样式。

<%= active_link_to "Menu", root_path, class: 'has-text-dark', active_class: 'has-text-danger' %>

Answer 9

使用link_to_unless_current，然后在CSS中看一下活动链接。

为rails中的所有活动链接添加“活动”类？

9 个答案: