Phoenix Hooks updated callback not restoring original CropperJS object

Questions / Help
, , ,
1

I am using Cropperjs library along with Phoenix LiveView. The cropper object is initialized inside mounted callback inside Client Hooks. Cropperjs methods are working in mounted callback.

There are two components:

  • ParentComponent
  • ChildComponent (this has LiveView JS hook mounted)

ChildComponent has phx-hook. When I update the ChildComponent (where I display the cropperjs object) from ParentComponent via send_update which is handled by updated callback, CropperJS methods won’t work.

2

Most likely you will need either to re-initialize it in the update as well, or use phx-update="ignore" attribute so any LiveView re-render won’t strip away any markup that your library generates.

1 Like
4

I tried with phx-update="ignore" but still cropperjs methods wont work.
Also, the cropperjs object is initialized in mounted callback of LiveView Hooks.