Livewire忽略不接收正确的数据。

Question

我正在使用selectize.js的下拉样式与生活电线。我使用livewire作为带有可排序列和分页的数据表。问题是，每次我进行分页或逐列排序时，javascript就会丢失，因此没有为下拉列表设置样式。我已经使用wire:ignore解决了样式问题。现在我遇到的新问题是传递给下拉列表的数据是不准确的。

@foreach($applications as $application)
    <p>{{$application->status}}</p>
    <div wire:ignore>
        <select class="selectize" name="status" data-width="200px">
            @foreach(['Pending',
                      'Hired',
                      'Under consideration'] as $status)
                <option
                    @if($application->status === $status) selected @endif>{{ $status }}</option>
            @endforeach
        </select>
    </div>
@endforeach

在<p>{{$application->status}}</p>标签中，我得到“待定”的状态，但在下拉列表中，它显示“雇用”。正确的状态是“待定”。

Answer 1

例如，当我使用"select2“时，我会在内容部分中这样做。

<select id="select2" wire:model="some">
//.....
</select>

在脚本部分

$(document).ready(function() {
   window.initSelectDrop=()=>{
      $('#select2').select2({
          placeholder: '{{ __('Select') }}',
          allowClear: true});
      }
   initSelectDrop();
   window.livewire.on('select2',()=>{
      initSelectDrop();
   });
});

在组件中

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

这并不总是与JS element...but一起正常工作，希望这能对您有所帮助。问候

Answer 2

现在可能有点晚了，但今后值得一提的是，我将不直接指出您的问题，而是解释wire:ignore的解决办法，wire:ignore指令忽略对进一步的请求和更新的更新或更改，这个属性是为使用JS第三方库定义的，wire:ignore指令防止所有它的嵌套元素更新，如果您想要排除Childs更新，可以使用wire:ignore.self指令