Laravel Livewire，如何在动态字段中应用 select2

Question

刀片文件

<div id="for_item" wire:ignore>
         <select wire:model="purchaseRequests.{{$index}}.item_id" class="select2 select2-sm" data-container="#for_item">
            <option value="">Select</option>
            @if(isset($itemList))
                @foreach ($itemList as $item)
                   <option value="{{$item['id']}}">{{$item['name']}}</option>
                @endforeach
            @endif
         </select>
    </div>



@push('scripts')
<script>
    $(document).ready(function () {
        $('.select2').on('change', function (e) {
            let elementName = $(this).attr('id');
            var data = $(this).select2("val");
            @this.set(elementName, data);
        });

    });

</script>
@endpush

我有添加额外行的按钮，select2 在静态字段中正常工作，但是当我单击按钮生成行时，select2 不工作。

Answer 1

组件

public function addRequestDetail()
{
 $this->dispatchBrowserEvent('reApplySelect2');
}

刀片

@push('scripts')
<script>
    $(document).ready(function () {
        window.addEventListener('reApplySelect2', event => {
            $('.select2').select2();
        });
    });
</script>
@endpush