Livewire中wire:model数组绑定失效：值正确但下拉框未选中

问题根源在于类型不匹配：你给selectedColumn赋值的是整数3，但HTML下拉框的<option>的value属性本质是字符串类型（哪怕输出的是数字，HTML也会解析为字符串）。Livewire的wire:model绑定是严格匹配类型的，整数3和字符串"3"无法匹配，导致下拉框无法自动选中目标选项。

解决方案（两种任选其一） #

方案1：将selectedColumn赋值为字符串类型 #

修改组件中的triggerModal方法，把整数3改为字符串"3"：

#[On('triggerModal')]
public function triggerModal(int $importFileId)
{
    $this->selectedColumn = "3"; // 改为字符串类型
    $this->cols = [0,1,2,3,4,5];
    $this->triggerModal = true;
}

方案2：给selectedColumn添加字符串类型声明 #

在组件里明确selectedColumn的类型为字符串，从根源保证类型一致：

public string $selectedColumn = ""; // 字符串类型初始化

#[On('triggerModal')]
public function triggerModal(int $importFileId)
{
    $this->selectedColumn = "3";
    $this->cols = [0,1,2,3,4,5];
    $this->triggerModal = true;
}

另外注意：你视图里的{{ $nameColumn }}应为{{ $selectedColumn }}，否则无法正确显示选中的值。如果要进一步避免渲染问题，可以给循环里的<option>加上wire:key（类型匹配后就会生效）：

<div>
    <label class="block text-sm font-medium leading-6 text-gray-900">Name</label>
    <select wire:model='selectedColumn'>
        <option value="">(Select Column)</option>
        @foreach ($cols as $col)
            <option value="{{ $col }}" wire:key="col-{{ $col }}">{{ $col }}</option>
        @endforeach
    </select>
</div>

Name Col: {{ $selectedColumn }}

内容的提问来源于stack exchange，提问作者Nibir Ahmed