当我选择一个选项时，表单输入清除

Question

我使用Laravel/livewire。我想从google地图中获取纬度和经度，并在输入中显示值:

<input id="latBranch" wire:model="lat" val="">
<input id="longBranch" wire:model="long" val="">

使用下面的谷歌代码，它工作良好，当页面加载:

...
infoWindow.setPosition(pos);
document.getElementById("latBranch").value = position.coords.latitude;
document.getElementById("longBranch").value = position.coords.longitude;
...
google.maps.event.addListener(marker, 'dragend', function (event) {
document.getElementById("latBranch").value = event.latLng.lat();
document.getElementById("longBranch").value = event.latLng.lng();
infoWindow.open(map, marker);
});
...

但问题是，当我从下面选择一个选项时，经度和纬度输入为空:

<select required wire:model="branchCountry">
@foreach ($countries as $row)
<option value="{{$row->id}}">{{ $row->countryname }}</option>
@endforeach
</select>

上面的选择选项获取国家Id，并将其传递给livewire控制器以加载省份，如下所示:

public function updatedbranchCountry()
{
if($this->branchCountry != '') {
$this->provinces = Province::orderby('provincename', 'asc')->where('country_id', $this->branchCountry)->get();
}
}

我的问题是，当我选择或更改select元素的选项时，如何在输入中保持经度和纬度。

Answer 1

为了解决这个问题，我在livewire emit中添加了经度和纬度，如下所示:

Livewire.emit('getLatitudeForInput', event.latLng.lat());
Livewire.emit('getLongitudeForInput', event.latLng.lng());

，然后在livewire控制器中，我使用侦听器来获取如下值:

protected $listeners = ['getLatitudeForInput','getLongitudeForInput'];
public function getLatitudeForInput($value)
{
if(!is_null($value))
$this->lat = $value;
}
public function getLongitudeForInput($value)
{
if(!is_null($value))
$this->long = $value;
}

然后我使用这些值。