Livewire 忽略不接收正确的数据答案

【问题标题】：Livewire ignore does not receive correct dataLivewire 忽略不接收正确的数据
【发布时间】：2021-07-20 13:22:24
【问题描述】：

我正在使用 selectize.js 通过 livewire 进行下拉样式。我将 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 标记内，我的状态为“待定”，但在下拉列表中显示为“已雇用”。正确的状态是“待定”。

【问题讨论】：

你试过wire:model="status" 吗？这样一来，您的@if selected @endif 甚至就没有必要了。不过你需要value="{{ $status }}"
@ClémentBaconnier 我不明白。主要原因是，在 if 语句中，我没有得到正确的 $application->status。如果我移除电线：忽略，我得到正确的。
<select wire:model="status" ....> 会将$status 绑定到您的select 标签。然后livewire会在输入改变时自动选择值并更新$status。而且您不必删除wire:ignore
@ClémentBaconnier 我这样做了，我得到了胡言乱语，状态是一个数组，所以它甚至不知道在没有应用程序状态的情况下选择哪个
所以...这个？ laravelplayground.com/#/snippets/…

标签： laravel laravel-livewire selectize.js

【解决方案1】：

（来自评论）@stalwart1014 例如，当我使用“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 元素一起正常工作......但希望这可以帮助你。问候

【讨论】：