saleyn
How can a liveview component be rendered inside a Phoenix EEX template?
I have a liveview component
defmodule MyApp.Shared.Status do
use Surface.LiveComponent
alias MyApp.Shared.FlashMessage
data online, :boolean, default: false
def render(assigns) do
~F"""
<div id={@id} class="status">
<FlashMessage id="status-flash" />
</div>
"""
end
that I would like to render inside the navigation bar “_navbar.html.eex” that is included in the “root.html.eex”:
$ cat root.html.eex
<html lang="en">
<head>
<%= csrf_meta_tag() %>
</head>
<body>
<%= render("_navbar.html", assigns) %>
<%= @inner_content %>
</body>
</html>
$ cat _navbar.html.eex
<header>
<nav class="nav-bar">
<div>
<!--
<%= live_component MyApp.Shared.Status, id: :main_status %>
<MyApp.Shared.Status id="main_status"/>
-->
</div>
</nav>
</header>
In this last file, “_navbar.html.eex” I tried rendering the Shared.Status component by using either <%= live_component MyApp.Shared.Status, id: :main_status %> or <MyApp.Shared.Status id="main_status"/> to no success. What am I missing?
Where Next?
Trending in Questions
Other Trending Topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Producing high quality Elixir screencasts since 2017.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #elixirconf
- #channels
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #blog-post
- #elixir-ls
- #ai
- #elixirconf-us
- #phoenix_html
- #iex
- #graphql
- #genstage
- #websockets
- #supervisor
- #advent-of-code
- #distillery
- #processes
- #api
- #forms
- #hex
- #security
- #metaprogramming
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Error tracking, logs, uptime, and Just Enough APM. Built for developers.
Practical resources that improve the lives of professional developers.
Bringing learning, work and compliance together since 1987.
Enabling companies to succeed by building software people love.
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"
Showing Posts 1 to 1- Show Best Posts
- Show All (oldest first)
- Show All (newest first)
APB9785
From the docs:
It seems like you’re trying to call the LiveComponent outside of a LiveView, which doesn’t work because the LC doesn’t spawn up its own process, but instead requires a parent LV process to run inside.
For this case, perhaps a function component would be an acceptable alternative?