Rails中使用带有Bootstrap按钮类的link_to和button_to行为不同。

Question

我在文章展示页面上有以下的link_to：

<%= link_to "Add Pictures",
      new_picture_path(article_id: @article.id),
      class: "btn btn-small btn-success" %>

这个代码通过使用“btn”类将“link”显示为按钮，效果非常好。唯一的问题是，在单击后，按钮上的文本会变成灰色（就像访问过的链接）。我该如何保持原始文本颜色（在这种情况下为白色）？或者说我需要哪些CSS魔法来保持原始文本颜色。

或者，我可以通过将其更改为以下button_to来修复它：

<%= button_to "Add Pictures",
      new_picture_path(article_id: @article.id),
      method: :get, class: "btn btn-small btn-success" %>

但问题在于，我的article_id被设置为nil，导致验证错误，即article_id未设置。
我该怎么办？修复带有css的link_to(如何修复?)或者修复button_to问题(如何修复?)。感谢任何帮助。

- Atarang

---

尝试这样做一次..<%= link_to "添加图片", new_picture_path(article_id: @article.id), class: "btn btn-small btn-success", color:inherit %> - Rahul Dess

@ Rahul，它出现了“未定义的本地变量或方法`inherit'”错误。 - Atarang

但以下两种变体都适用： <%= link_to "添加图片", new_picture_path(article_id: @article.id), class: "btn btn-small btn-success", style: "color:inherit" %> 和 <%= link_to "添加图片", new_picture_path(article_id: @article.id), class: "btn btn-small btn-success", style: "color:white" %> - Atarang

可以的，你可以使用它，我只是忘记了语法。 - Rahul Dess

Answer 1

如果你的CSS代码包含以下内容：

a:visited {
  color: #666666;
}

这可能会导致link_to和button_to之间的渲染效果不同，因为link_to将被解析为<a href=""></a>，而button_to将被解析为<form>..</form>。

注意：如果您使用了...

<%= button_to 'Users', users_path(app_id: application.id), method: :get, class: 'btn btn-info btn-xs' %>

Rails将编译为：

<form class="button_to" method="get" action="/users?app_id=1">
   <input class="btn btn-info btn-xs" type="submit" value="Users">
</form>

但是在您单击按钮后，app_id=1将不会传递到rails的params中。

解决方法如下：

1. 使用带有class属性的link_to：style: "color:white"，就像@Rahul所说的那样。

2. 删除css代码：a:visited

- zhaoqing