Rails：如何在Rails应用程序中将`<img src=>`转换为`image_tag`？

Question

这是我在这里发布的第一篇文章，可能听起来非常愚蠢。我正在构建我的第一个Rails应用程序。

我在我的index.html.erb文件中有这一行：

    <img src="/assets/rand_front/<%= @random_image%>", style='height:50vw;width:100vw;margin-bottom:20px;' >

我想使用image_tag来替代img src，请问正确的用法是什么？

到目前为止，我尝试了以下几个版本：

<%= image_tag("/assets/rand_front/<%= @random_image %>", style='height:50vw;width:100vw;margin-bottom:20px;') %>

<%= image_tag("/assets/rand_front/<%= @random_image %>", style='height:50vw;width:100vw;margin-bottom:20px;') %>

以及其他很多版本，但都没有成功，我做错了什么？如何正确编写？

这里的<%= @random_image %>是从控制器中的index方法中获取的变量。

def index
   @products = Product.all.order(created_at: :desc).group_by(&:category_id)
    @images  = ["1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg", "6.jpg", "7.jpg", "8.jpg", "9.jpg", "10.jpg"]
    @random_no = rand(10)
    @random_image = @images[@random_no]
end

- Slowboy

---

顺便提一下，你可以使用 @random_image = "#{rand(1..10)}.jpg" 或者 - 如果这些只是占位符 - @random_image = @images.sample。 - Stefan

Answer 1

<%= image_tag "rand_front/#{@random_image}", style: 'height:50vw;width:100vw;margin-bottom:20px;' %>

image_tag会自动在路径的开头添加assets

查看Image Tag文档了解更多信息。

- Qaisar Nadeem

Answer 2

这是Ruby on Rails明确处理的内容。

 <%= image_tag("source", {:style => "width:100px;"}) %>

这意味着Ruby允许您在代码中省略（{ }）。

对于我来说，刚开始学习时了解Ruby on Rails实际运行代码的方式非常重要。

换句话说，是的，您可以省略（{ }）的形式，因为Ruby会理解您的代码。希望这能帮助澄清一些问题...

- Jonathan Sanchez

Answer 3

如果我没记错的话，你的资产文件夹中有一个名为“rand_front”的文件夹，所以你应该调用image_tag("#{@random_image}")，因为默认情况下image_tag助手应该检查资产目录中所有文件夹的图像名称。

对于CSS属性，您可以考虑使用options哈希，这将允许您将CSS属性作为键和所需值传递。 image_tag("#{@random_image}", height: 20, width: 20)。您可以查看先前回答中的文档。

- Adetoyese Kola-Balogun