PJUllrich

PJUllrich

Author of Building Table Views with Phoenix LiveView

Pass unspecified assigns Map to LiveComponent with LiveView 0.17.2

I updated a project to the latest Phoenix LiveView 0.17.2 and can’t figure out how to pass assigns to a LiveComponent. I guess I need some kind of “spread operator” here, but don’t know the proper syntax.

Previous code:

<%= live_component @socket, Web.MyModule, Map.merge(assigns, %{id: "my-component-id"}) %>

My attempts:

# Sets an `assigns` assign on the `assigns` of the LiveComponent (got it? :D)
# So, in the LiveComponent I have now `assigns.assigns.my_var` instead of 
# having @my_var or assigns.my_var
<.live_component module={Web.AddressChangeLive.ChangeComponent}, id="change-component", assigns />

# In this case, `module` and `id` are `nil`
<.live_component Map.merge(assigns, %{module={Web.AddressChangeLive.ChangeComponent}, id="change-component"}) />

Could you hep me further, please?

Marked As Solved

moogle19

moogle19

You have to remove the , in your <.live_component /> tag (just like in normal html) and you can give the assigns as last argument, e.g.:

<.live_component module={Web.AddressChangeLive.ChangeComponent} id="change-component" {assigns} />

Edit: Take a look at Cost of stateful components in the documentation

Also Liked

seb3s

seb3s

Hi,
you should try something like :

<.live_component module={Web.MyModule} id="your_id" {assigns} />

But generally, you should pass to your components only the data it uses (not all the assigns map)
Also note that the commas are removed (normal HTML attributes)

Cheers,
Sébastien.

moogle19

moogle19

Then I won’t edit my post to add a link to the documentation next time. :joy:

PJUllrich

PJUllrich

Author of Building Table Views with Phoenix LiveView

Ah yes! The comma was the problem! I’d like to accept both answers but since I can select only one I will choose the earliest :man_shrugging:t2: Thank you both though!

Where Next?

Popular in Questions Top

marius95
Hello everyone, I try to use an Javascript Event Handler in my root.html.leex file. Therefore I created a function in the app.js file: ...
New
sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
lastday4you
I wanted to check elixir version in phoenix because i found that my elixir is 1.5 but when i use Enum.chunk_by it said the function is un...
New
jaysoifer
Is there a way to rollback a specific migration and only that one ("skipping" all the other ones)? Would mix ecto.rollback -v 2008090...
New
JeremM34
Hello, how can I check the Phoenix version ? Thanks !
New
jerry
Good day to you all. I have been struggling to get a query involving like and ilike to work. Can anyone assist me on this, please? pro...
New
lucidguppy
I have a super simple question about elixir - how would I take a file like this foo bar baz and output a new file that enumerates th...
New
romenigld
I am trying to run a deploy with docker and I successfully runned with this command: docker build -t romenigld/blog-prod . but when I t...
New
dotdotdotPaul
Okay, I'm having a heck of a time trying to figure out how to best handle the validation of belongs_to associations in Ecto. I'm sure I'...
New
svb
Hi! Currently I want to submit a form by pressing the Enter key. However, since my input field is of type “textarea” this is just adds a...
New

Other popular topics Top

josevalim
Hi everyone, One of the features added to Elixir early on to help integration with Erlang code was the idea of overridable function defi...
New
pmjoe
I have a relationship of love and hate with Elixir. Lots of things are just absolutely right, but there are some things that are kind of ...
New
gausby
I asked this very same question on twitter and got some interesting feedback, but I thought it would be a good question to ask here as we...
1207 39247 209
New
chrismccord
This release brings a number of exciting features, including integration with the new Phoenix LiveDashboard and Phoenix LiveView. There h...
New
fayddelight
I tried installing elixir 1.11.2 erlang 23.3.4 via asdf in my zsh shell. Enabled the versions locally and globally. When I list them ...
New
AngeloChecked
What learn first? Rust or Elixir Hi Elixir community! I’m here because i want learn a new language. I’m a junior developer and mainly i ...
New
KronicDeth
Elixir plugin for JetBrain’s IntelliJ Platform (including Rubymine) This is a plugin that adds support for Elixir to JetBrains IntelliJ...
289 35953 110
New
marick
I had some trouble figuring out how to make many-to-many associations work. Once I got it working, I wrote a blog post. Because I'm a nov...
New
jononomo
For some reason my phoenix channels are working for me in my local dev environment, but as soon as I deploy via Docker, I get a 403 error...
New
vonH
In asking this question I am more interested about the expressiveness of the language itself and less concerned about the availability of...
New

We're in Beta

About us Mission Statement