fix: Ensure correct UUID is dispatched when using multiple dropzone c…

…omponents on the same page (#32)
dasundev · Apr 27, 2024 · 8f54b02 · 8f54b02
2 parents 378ec90 + 89e8bb3
commit 8f54b02
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/resources/views/livewire/dropzone.blade.php b/resources/views/livewire/dropzone.blade.php
@@ -2,7 +2,8 @@
     x-cloak
     x-data="dropzone({
         _this: @this,
-        multiple: @js($multiple)
+        uuid: @js($uuid)
+        multiple: @js($multiple),
     })"
     @dragenter.prevent.document="onDragenter($event)"
     @dragleave.prevent="onDragleave($event)"
@@ -117,7 +118,7 @@ class="dz-hidden"
 
     @script
     <script>
-        Alpine.data('dropzone', ({ _this, multiple }) => {
+        Alpine.data('dropzone', ({ _this, multiple, uuid }) => {
             return ({
                 isDragging: false,
                 isDropped: false,
@@ -154,10 +155,10 @@ class="dz-hidden"
                 },
                 removeUpload(tmpFilename) {
                     // Dispatch an event to remove the temporarily uploaded file
-                    _this.dispatch('{{ $uuid }}:fileRemoved', { tmpFilename })
+                    _this.dispatch(uuid + ':fileRemoved', { tmpFilename })
                 },
             });
         })
     </script>
     @endscript
-</div>
+</div>