Before Heex I could do something like this:
<div id="profile" class="border-2 bg-white px-4 py-1 <%= if @user.active, do: "bg-white", else: "bg-gray" %>>
How do I do this with Heex?
You’d do:
<div id="profile" class={"border-2 bg-white px-4 py-1 #{if @user.active, do: "bg-white", else: "bg-gray"}"}>
Another general example:
attribute={"string"} => string
attribute={@variable} => interprets the variable
attribute={something(arg1, arg2)} => interprets the function
<%= for item <- list do %>
<div id={item.id} ...></div>
<div class={if item.size > 2, do: "special-class", else: "regular-class"}></div>
<div class={"always-this-class #{if item.color == "blue", do: "blue-background-class"}"}></div>
<% end %>
3 Likes
