
mrmurphy
How exactly does phx-update detect changes?
I’ve run into a situation where I’ve got a list of posts inside of a container that uses phx-update=“prepend”, and the posts on the socket are temporary assigns. Inside of the “for” comprehension, I want to render data not only from the post, but from another assign on the socket.
When the post changes, my DOM updates render, but when the other assign I’m using (pending_loves, in the image) changes, I don’t get any DOM updates. I’m guessing this is because live view is doing some magic change tracking around the for comprehension specifically? What’s the most idiomatic way to inform Live View that I want the content inside of the for
to update when a different assign changes as well?
Most Liked

mrmurphy
Thanks! Victor Mono:

dimitarvp
Thank you! Instant switch in my terminal programs. Can’t believe I missed it even though I have it in my library.
Previously used InconsolataGo
but Victor Mono
is definitely better.

mrmurphy
I thought maybe if I included the pending_loves
assign on the right-hand side of the for comprehension, the change would be picked up and re-rendered. But no dice:
<div id="posts" class="max-w-lg mx-auto dark:bg-gray-800" phx-update="prepend">
<%= for {post, pending_loves} <- (@posts|>Enum.map(&({&1, get_pending_loves(@pending_loves, &1.id)}))) do %>
<div id="<%= post.id %>">
Even with this change, when I update the assign @pending_loves, the count of pending loves does not update on the page inside of the for comprehension until the post object is updated. It does update if placed outside of the comprehension, though, even inside of the phx-update="prepend"
container.
Popular Backend topics










Other popular topics










Latest in Questions
Latest (all)
Categories:
Popular Portals
- /elixir
- /rust
- /wasm
- /ruby
- /erlang
- /phoenix
- /keyboards
- /js
- /rails
- /python
- /security
- /go
- /swift
- /vim
- /clojure
- /java
- /haskell
- /emacs
- /svelte
- /onivim
- /typescript
- /crystal
- /c-plus-plus
- /tailwind
- /kotlin
- /gleam
- /react
- /flutter
- /elm
- /ocaml
- /vscode
- /opensuse
- /ash
- /centos
- /php
- /deepseek
- /scala
- /zig
- /html
- /debian
- /nixos
- /lisp
- /agda
- /textmate
- /sublime-text
- /react-native
- /kubuntu
- /arch-linux
- /ubuntu
- /revery
- /manjaro
- /spring
- /django
- /diversity
- /nodejs
- /lua
- /julia
- /slackware
- /c
- /neovim