如何让 app.html.heex 在 LiveView 中正确使用分配

Question

背景

我有一个 Phoenix 应用程序，其中所有页面（登录页面除外）顶部都有一个菜单。 因此，仅当用户已经登录时才会显示此菜单。

我正在尝试通过将所述菜单合并到

app.html.heex

中来复制这种行为，这样我就不必不断重复它。

但是，无论我做什么，菜单都不会显示。

代码

我正在尝试更改我的

app.html

并验证用户是否使用

assigns[:user]

登录。

app.html.heex

：

<header>

 <%= if assigns[:user] do %>
   <h1> Cool Menu here </h1>
 <% end %>

</header>

<main class="">
  <div class="mx-auto max-w-2xl">
    <.flash_group flash={@flash} />
    <%= @inner_content %>
  </div>
</main>

登录过程是异步的，如下所示。基本上，我向经理发送登录请求，当需要回复时，我用

assigns[:user]

更新套接字并重定向到一个很酷的页面。

user_login_live.ex

：

defmodule WebInterface.MyAppLive do
  use WebInterface, :live_view

  @impl true
  def mount(_params, _session, socket), do: {:ok, socket}

  @impl true
  def handle_event("login", params, socket) do
    IO.puts("Seding async request")
    :ok = Manager.login(params)
    {:noreply, socket}
  end

  @impl true
  def handle_info({:login,  user, :done}, socket) do
    IO.puts("Authentication succeeded for user #{inspect(user)}")

    updated_socket =
      socket
      |> assign(:user, user)
      |> redirect(to: ~p"/cool_page")

    {:noreply, updated_socket}
  end

end

我希望酷页面有

<h1>

菜单，但事实并非如此。

问题

• 我在这里做错了什么？

• assigns

  不是自动更新吗？

• app.html.heex

  的工作方式与其他文件不同吗？

Answer 1

redirect/2

重新加载页面，因此状态（包括“分配”）被丢弃。如需参考，请参阅 redirect/2 文档。

如果

MyAppLive

已经渲染

app.html.heex

，您可以删除

redirect(to: ~p"/cool_page")

调用。通过 LiveViews 更改跟踪，该值将发送到客户端，并且 DOM 应相应更新。

如果路由

"/cool_page"

由不同的LiveView处理，您可以将用户作为URL的一部分传递，然后处理相应LiveView的

mount

中的参数：

user_login_live.ex

...
socket
|> redirect(to: ~p"/cool_page/#{user}")
...

router.ex

...
live "/cool_page/:user", OtherLiveView, :index
...

other_live.ex

def mount(%{"user" => user}, _session, socket) do
  socket =
    socket
    |> assign(user: user)

   {:ok, socket}
end