无法解析依赖项[参数#0]



我有一个livewire组件类和一个livewire刀片组件。在livewire刀片组件中,我有一个提交按钮,当它被单击时,应该调用updatedCity方法来更新城市。

但是,当在livewire组件上单击提交按钮时,就会出现错误

无法解决依赖关系[参数#0 [$city]]在类AppHttpLivewireWeatherInfo

感谢
class WeatherInfo extends Component 
{ 
public $city; 
private $currentWeatherRes; 
private $forecastWeatherRes;
private $unit;

public function mount()
{
$this->city = auth()->user()->city ?? '';
$this->apiKey = config('services.openweather.key');
$this->getWeatherByCity();
}

public function test($city)
{
$this->city = $city;
$this->apiKey = config('services.openweather.key');

$this->getWeatherByCity();
}

protected function getWeatherByCity()
{

$this->currentWeatherResp = Http::get(
"http://api.weatherapi.com/v1/current.json?&q={$this->city}&key={$this->apiKey}")->json();

$this->forecastWeatherResp = Http::get(
"http://api.weatherapi.com/v1/forecast.json?key={$this->apiKey}&q={$this->city}&days=7")->json();


}

public function render()
{
return view('livewire.weather-info', [
'currentWeatherResp' => $this->currentWeatherResp,
'forecastWeatherResp' => $this->forecastWeatherResp,
]);
}
}

叶片组件是这样的:

<div>
@guest
<h1>Please login/register</h1>
@else
<h1>Weather in
<b>{{ $forecastWeatherResp['city']['name'] }}</b></h1>

<main>

<div>
<div class="flex items-center justify-between rounded-md">
<form wire:submit.prevent="test">
<input wire:model.defer="city"
type="text" name="city">
<div>
<x-form.button>Submit</x-form.button>
</div>
</form>
</div>
</div>

<div x-data="{ openedIndex: -1  }">
<div
@click="openedIndex == 0 ? openedIndex = -1 : openedIndex = 0">

<div>
<img
src="http://openweathermap.org/img/wn/{{ $forecastWeatherResp['current']['condition']['icon'] }}.png"
alt="weather icon">
<span>
{{ round($forecastWeatherResp['current']['temp_c']) }}º
</span>
</div>

<div>
<span>
Today
</span>
<span>
{{ ucwords($forecastWeatherResp['current']['condition']['text']) }}
</span>
</div>

<svg style="display: none;"
x-show.transition.duration.500ms="openedIndex != 0"
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd"
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
clip-rule="evenodd"/>
</svg>
<svg
x-show.transition.duration.500ms="openedIndex == 0"
xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd"
d="M14.707 12.707a1 1 0 01-1.414 0L10 9.414l-3.293 3.293a1 1 0 01-1.414-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 010 1.414z"
clip-rule="evenodd"/>
</svg>
</div>
<div
x-show="openedIndex == 0"
class="w-full border " style="display: none;">
<div class="border-t border-gray-200">
<dl>

<div class="bg-white px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
<dt class="text-sm font-medium text-gray-500">
Feels Like
</dt>
<dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
{{ round($forecastWeatherResp['current']['temp_c']) }}º
</dd>
</div>
....
</dl>
</div>

</div>

@foreach($forecastWeatherResp['forecast']['forecastday'] as $weather)
<ul>
<li
@click="openedIndex == {{ $loop->iteration }} ? openedIndex = -1 : openedIndex = {{$loop->iteration}}"
class="w-full">
<div>
<div>
<img src="http://openweathermap.org/img/wn/{{ $weather['day']['condition']['icon'] }}"
alt="weather icon">
</div>
....

</div>

<div
x-show="openedIndex == {{ $loop->iteration }}">
<div>
<dl>

<div>
<dt>
Feels Like
</dt>
<dd>
{{ round($weather['day']['avgtemp_c']) }}º
</dd>
</div>
.....
</dl>
</div>

</div>

</li>

</ul>

@endforeach
</div>
</main>

@endguest
</div>

你不需要传递任何东西给你的test()方法,$city参数已经通过wire:model="city"设置了

public function test()
{
$this->apiKey = config('services.openweather.key');
$this->getWeatherByCity();
}

API密钥也不会在请求之间改变,这意味着在test()方法中设置$this->apiKey = config('services.openweather.key');也是多余的,因为它在mount()中设置。

这意味着你可以完全删除你的test()方法,使getWeatherByCity()成为一个公共方法(而不是一个受保护的),然后执行

<form wire:submit.prevent="getWeatherByCity">

您需要将$city参数传递给test函数,如下所示

<form wire:submit.prevent="test('the city you want')">

相关内容

  • 没有找到相关文章

最新更新