Dynamic JS in a Phoenix live component

Phoenix Forum Questions / Help
, ,
2

You’re doing several things wrong here and could be any one or all of them:

  • To get the gotcha out of the way, I think you have stumbled across this.
  • You should be using js hooks as opposed to putting the script tag in heex like that. Hooks ensure the JS fires at appropriate times in the LV lifecycle.
  • Further to the last point, I’m unsure if this is all your code (and I haven’t fully taken in all of what’s there) but if there is anything updating assigns as it scrolls the UI will be updated to whatever the server thinks it should be. This will result in anything JS has done to be overwritten.
  • Always use an appropriate Phoenix function for manipulating assigns (assign, assign_new, update, etc)—they are not merely wrappers around Map.put and are required for change tracking to work.
4 Likes