Laravel Livewire select2 在表单上具有可变数量的选择菜单

Question

我在我的 laravel livewire 项目中使用 Select2 作为下拉菜单。它似乎工作得很好，但我遇到了一个包含可变数量下拉菜单的动态页面的问题。我确定我只是没有正确处理数组的值，但这是我为选择所做的：

<x-input.select2 wire:model.defer="myArray.{{ $tx->id }}" id="myselect-{{ $tx->id }}" usePlaceholder="true">
    @foreach ($accounts as $account)
        <option ...></option>
    @endforeach
</x-input.select2>

这里是 select2 组件：

@props(['id', 'usePlaceholder' => null, 'isDisabled' => null])

<div wire:ignore style="width:100%;" id="select2-{{ $id }}">
    <select {{ $attributes }} id="{{ $id }}" name="{{ $id }}[]" class="form-select select2" data-width="100%" data-select2-id="{{ $id }}" @if ($isDisabled) disabled @endif>
        @if ($usePlaceholder)
            <option></option>
        @endif
        {{ $slot }}
    </select>
</div>

@push('custom-scripts')
<script defer>
    $(document).ready(function() {    
        let select2 = $('#' + @js($id));
        
        select2.select2({
            dropdownParent: $('#select2-' + @js($id)),
            placeholder: 'Select an option',
            minimumResultsForSearch: 15
        });
            
     });
</script>
@endpush

这是我的验证服务器端：

$validatedData = $this->validate([ 'myArray.*.account_ref_id' => '必填', ]);

每当我提交表单时，它都会显示为验证错误：

The myArray.0.account_ref_id field is required.
The myArray.1.account_ref_id field is required.

我目前在列表上有 2 个项目，所以计数是有意义的，但是这 2 个项目的 ID 是 59 和 60，所以我不知道 0 和 1 来自哪里。

我已经尝试了所有可能的组合，但未能解决这个问题。

如果我不使用 account_ref_id 部分，只在刀片文件中使用

myArray.*

并在验证规则中使用相同的方法，它会通过验证，我只会得到一个空数组，所以如果数组为空，它实际上不应该通过验证.

更新

我至少可以通过向 select2 组件添加更改事件来设置 id 的值来获得结果：

@this.set(@js($id), $(select2).val());

然后将元素本身的 id 更改为像

id="myArray.{{ $tx->id }}"

这样的点符号。

但是，这会破坏 select2 的 css，并且它在页面加载时显示为无样式。我还尝试用方括号（

[

和

]

）代替点符号。