How to Create Nested LiveView Components: Difference between revisions

From ElixirBlocks
Jump to: navigation, search
(Created page with "This example demonstrates a nested LiveView component. <source> defmodule AppxWeb.SandboxLive do use AppxWeb, :live_view import MyComponent def mount(_params, _session, socket) do {:ok, socket} end def render(assigns) do ~H""" Hello World! YAY <MyComponent.greet name="Jane" /> """ end end </source> <source> defmodule MyComponent do use Phoenix.Component def greet(assigns) do ~H""" <p>Hello, <%= @name %>!</p>...")
 
No edit summary
Line 11: Line 11:
   def render(assigns) do
   def render(assigns) do
  ~H"""
  ~H"""
Hello World! YAY
    Hello World! YAY
<MyComponent.greet name="Jane" />
<MyComponent.greet name="Jane" />
  """  
  """  
   end
   end

Revision as of 12:23, 6 April 2023

This example demonstrates a nested LiveView component.


defmodule AppxWeb.SandboxLive do
   use AppxWeb, :live_view  
   import MyComponent
   def mount(_params, _session, socket)  do
	 {:ok, socket}  
   end
   def render(assigns) do
	   ~H"""
	     Hello World! YAY
		 <MyComponent.greet name="Jane" />
	   """ 
   end
end

defmodule MyComponent do
   use Phoenix.Component

   def greet(assigns) do
	   ~H"""
			  <p>Hello, <%= @name %>!</p>
	   """ 
   end
end