Laravel Livewire：输入选择，选择默认选项

Question

我正在尝试从数据库中获取国家/地区代码，并尝试通过 IP 地址获取默认值。它按照我想要的方式工作了一秒钟，但随后我不知道会发生什么，但它会自行刷新并滚动到第一个选项而不是选定的选项。

Livewire 控制器组件

use App\Models\CountryCodes;
use Livewire\Component;
use Location;

class TestCountry extends Component
{
    public $iso;
    public $country_codes;
    public $country_code;

    public function mount()
    {
        $iso=Location::get('ip');
        $this->iso=$iso->countryCode;
    }

    public function render()
    {
        return view('livewire.test-country',[
            $this->country_codes = CountryCodes::select('nicename','iso','phonecode')->get()->toArray()
        ]);
    }
}

Livewire 刀片组件

<select wire:model.lazy="country_code" name="country_code" id="country_code" class="form-control" required>
    @foreach($country_codes as $country_code)
        <option value="{!! $country_code['iso'] !!}"
                wire:key="{{$country_code['iso']}}"
                {{ $country_code['iso'] == $iso ? 'selected' : ''}}>
            {!! $country_code['iso'] !!} +{!! $country_code['phonecode'] !!}
        </option>
    @endforeach
</select>

此代码确实选择了我的默认选项，但它会自动更改并移动到第一个选项。我在这里做错了什么吗？

Answer 1

我相信发生的事情是，$iso设置正确，但select绑定到$country_code属性，而不是$iso，简单地说，您所做的检查有效，但因为$country_code没有值，所以当状态更新时所选选项会丢失活线。

TLDR：Livewire 正在检查wire:model属性中的所有内容，因此必须设置类属性才能使其正常工作。

我会尝试这样的事情：

public function mount()
{
    $iso = Location::get('ip');
    $this->iso = $iso->countryCode;

    // set $country_code to $iso
    $this->country_code = $this->iso;
}

我相信Livewire会智能地选择状态，所以我认为selected可以删除该检查：

<select wire:model.lazy="country_code" name="country_code" id="country_code" class="form-control" required>
    @foreach($country_codes as $country_code)
        <option
            value="{!! $country_code['iso'] !!}"
            wire:key="{{$country_code['iso']}}"
        >
            {!! $country_code['iso'] !!} +{!! $country_code['phonecode'] !!}
        </option>
    @endforeach
</select>

另外，在视图中使用{!! !!}标签的任何理由而不仅仅是{{ }}？