'updatedFoo + select2 not working in livewire, why?

I just want to show the spinner during option selection

  <div  wire:ignore  class="mt-0 ">
      <select class="form-control form-control-sm custom__select " id="select2" wire:model="check">
          <option value="10">-- Select region --</option>
          @foreach($regions as $region)
              <option value="{{ $region->region_id }}">{{ $region->title_ru }}</option>

          @endforeach
      </select>
  </div>

        @if($loadState)
        <div class="position-relative">
            
            <div class="spinner-border spinner-border-sm text-light " role="status">
              <span class="visually-hidden">Loading...</span>
            </div>

        </div>

        @endif

      @push('scripts')
          <script>
              $(document).ready(function () {
                  $('#select2').select2({
                      placeholder: 'Select an option',
                  });

                  $(document).on('change', '#select2', function (e) {
                      @this.set('selRegion', e.target.value);
                  });

              });

          </script>
      @endpush

controller:

public function updatedCheck()
{
    $this->loadState = true;
}

this works without wire:ignore, but select2 itself doesn't work without it. i saw a similar question, but can't figure out how to apply it to my example



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source