如何为 Rails 重写 HTML答案

【问题标题】：How to rewrite HTML for Rails如何为 Rails 重写 HTML
【发布时间】：2015-03-09 02:45:56
【问题描述】：

我正在尝试重新编写下面的代码，以便它使用 image_tag。我知道如何应用类属性，但如何应用“data-dark-logo”之类的自定义属性？

我正在学习如何开发和构建具有以下 HTML 的应用程序：

<div id="logo">
  <a href="index.html" class="standard-logo" data-dark-logo="external_assets/images/logo-dark.png">
    <img src="external_assets/images/logo.png" alt="Canvas Logo">
  </a>
  <a href="index.html" class="retina-logo" data-dark-logo="external_assets/images/logo-dark@2x.png">
    <img src="external_assets/images/logo@2x.png" alt="Canvas Logo">
  </a>
</div>

我正在尝试重写它，以便它可以在我的 Rails 应用程序中运行。

【问题讨论】：

向我们展示到目前为止您对 rails 部分所做的工作，我可以向您展示如何添加数据属性

标签： html ruby-on-rails erb

【解决方案1】：

只需将数据属性作为哈希传递。

<%= link_to '/link', class: 'standard-logo', data: {'dark-logo' => 'external_assets/....' do %>
  <%= image_tag ('external_assets/...') %>
<% end %>

【讨论】：

在这个解决方案中，'data-dark-logo' 是否没有从资产管道中提取？

【解决方案2】：

像这样？

<div id="logo">
    <%= link_to("index.html", class: "standard-logo", data-dark-logo: "external_assets/images/logo-dark.png") do %>
        <%= image_tag("external_assets/images/logo.png",    alt: "Canvas Logo") %>
    <% end %>
    <%= link_to("index.html", class: "retina-logo",   data-dark-logo: "external_assets/images/logo-dark@2x.png") do %>
        <%= image_tag("external_assets/images/logo@2x.png", alt: "Canvas Logo") %>
    <% end %>
</div>

编辑：

要让 data-dark-logo 从资产管道中拉出您的资产，请尝试使用asset_path 帮助器：

<%= link_to("index.html", class: "standard-logo", data-dark-logo: asset_path("external_assets/images/logo-dark.png")) do %>

【讨论】：

在这个解决方案中，'data-dark-logo' 是否没有从资产管道中提取？
不，不是。要使其从资产管道中提取，您需要将图像放在 public/assets/images 目录中。见guides.rubyonrails.org/…
对不起，我刚刚重读了你的评论，现在我明白你在问什么了。不，data-dark-logo 只会将该路径直接复制到 HTML 中。

【解决方案3】：

我想出的解决方案是这样的：

    <div id="logo">
    <%= link_to welcome_index_path, class: 'standard-logo', data: {'dark-logo' => asset_path("front/logo-dark.png") } do %>
        <%= image_tag("front/logo.png") %>
    <% end %>
    <%= link_to welcome_index_path, class: 'retina-logo', data: {'dark-logo' => asset_path("front/logo-dark@2x.png") } do %>
        <%= image_tag("front/logo@2x.png") %>
    <% end %>
    </div>

但我不确定这是否符合 Rails 最佳实践

【讨论】：