Question

Livewire Dom 更新破坏 jquery 插件，如 Select2 等

2021-10-30

444

jquery-plugins jquery-select2 break laravel-livewire

我遇到了一个问题，当 livewire DOM 更新 jquery 插件不起作用时，jquery 插件会中断并且无法工作。请提供正确的指导，谢谢

Answer 1

当 select2 时，我通过执行下一步解决了该问题

//in component
public $selectedElem;

public function hydrate()
{
   $this->emit('select2Hydrate');
}

public function updatedSelectedElem($value)
{
   dd($value);
}

//in blade
<select class="form-control select2_livewire" wire:model="selectedElem">
   //.....
</select>

<script>
 
  $(document).ready(function() {

      window.loadSelect2 = () => {
         $('.select2_livewire').select2().on('change',function () {
             @this.set('selectedElem',$(this).val());
         });
      }
      loadSelect2();
      window.livewire.on('select2Hydrate',()=>{
         loadSelect2();
      });  
  }   

</script>