Rails link_to使用默认的HTML按钮样式

Question

我有一个使用FormHelper的带有提交按钮的Rails表单。

<p><%= form.submit %></p>

在同一页面上，我有一个取消按钮，该按钮可以返回到上一页（索引页面）。

<p><%= link_to 'Cancel', base_files_path() %></p>

我想设置link_to元素的样式，使其看起来像“提交”按钮。我尝试了button_to FormHelper，但是它创建了自己的提交按钮，该按钮干扰了正常表单的提交操作。我可以将一个类附加到link_to元素上，以使其样式设置吗？

Here is a screenshot for reference

Answer 1

样式是CSS的工作。您可能想用CSS类名“标记”链接，然后从样式表中引用它：

link_to 'Cancel', base_fules_path, class: "button"

.button {
  /* your styles here */
}

本机样式取决于平台。您可以在链接上使用appearance: button样式，但可以使用appearance isn't particularly well supported。

Answer 2

如果您在项目中使用Bootstrap，则可以通过以下方式获得相同的格式：

<%= link_to 'Cancel', base_files_path,class: "btn btn-default" %>

Answer 3

EDIT ：我想补充一点，可以使用button_to帮助程序，它的工作方式类似于link_to，但仅当您不使用表单，因为button_to表单将引发冲突。这对我来说是个问题，因为“取消”按钮正在触发我的表单上的表单验证。

AFAIK不可能与任何内置的Rails组件一起使用，因此我选择使用HTML和Javascript来获得所需的内容。

旧代码：

<%= link_to 'Cancel', base_files_path() %>

新代码：

<button type='button' onclick="location.href='<%= base_files_path() %>';">Cancel</button>

代码并不漂亮，但这是我获得想要的外观的最快方法。

Answer 4

您必须添加课程选项

<p><%= link_to 'Cancel', base_files_path(), class: "your_class_here" %></p>