2

我有一个顺风的 Rails 7 应用程序，我正在做这样的事情：

@list = [{name: "Some", width: "3/12"}, {name: "other", width: "6/12"}]

# In the view
<%= render 'mypartial': list: @list %>

# In the partial
<% list.each do |item|%>
  <div class="w-<%= item[:width] %>">
    <%= item[:name] %>
  </div>
<% end %>

视图生成正确的 HTML ( ex: <div class="w-6/12">)，但浏览器无法识别这些类。如果我在不传递变量的情况下对它们进行硬编码，那么一切正常。我做错了什么或错过了什么？

4

1 回答 1

3

如果有人有同样的问题，这是来自doc。

## Class names must be spelled out

For Tailwind to work, your class names need to be spelled out. They can't be programmatically composed. So no "text-gray-#{grade}", only "text-gray-500".

Atm，我在其中添加了一个动态变量列表，tailwind.config.js它工作正常，但您需要确保所有动态变量都在那里。

  purge: {
    safelist: [
     w-1/12,
     ....
    ],
  },
于 2022-01-06T22:59:19.160 回答