单引号导致LiveView模板处理错误

Question

我想在我的Phoenix LiveView模板中使用以下Tainwind类:

<div class="before:content-['Not_Hovering'] hover:before:content-['Hovering']">
<!-- ... -->
</div>

但是单引号没有正确处理，导致以下错误:

no function clause matching in Phoenix.LiveView.Engine.analyze_list/4

The following arguments were given to Phoenix.LiveView.Engine.analyze_list/4:

# 1
"'"

# 2
{:restricted, %{}}

# 3
%{[:default_avatar] => true, [:groups] => true, [:myself] => true}

# 4
["before:content-[", []]

Attempted function clauses (showing 2 out of 2):

defp analyze_list([31m[head | tail][0m, [22mvars[0m, [22massigns[0m, [22macc[0m)
defp analyze_list([31m[][0m, [22mvars[0m, [22massigns[0m, [22macc[0m)

我怎样才能在LiveView模板的类字符串中使用单引号，这样我就可以使用这些顺风类了?

Answer 1

这个问题可以通过使用一个符号而不是通常的二进制字符串来解决:

<div class={~s"before:content-['Not_Hovering'] hover:before:content-['Hovering']"}>
<!-- ... -->
</div>