如何正确实现这种情况？

Question

我有一条路线：

Route::get('/', [FrontController::class, 'index']);

在这个控制器中，我获得了经过身份验证的用户所在城市未来 5 天的天气。用户 table 有一列“城市”，api 请求基于该城市。

if (auth()->user()) {
    $cityName = auth()->user()->city;
    $apiKey = config('services.api.key');

    // get the weather based on the provided city

    $weatherResponse= Http::get("...");

    return view('front.index', [
        'weatherRespons' => $weatherRespons->json(),
    ]);
} else {
    return view('front.index');
}

在索引视图中

@guest

    <h1>login/register to show your city weather</h1>

@else

    <h1>Weather in {{ $weatherResponse['city'] }}</h1>

    <x-weather :weatherResponse="$weatherResponse" />

@endguest

此组件 x-weather 有一些样式可以显示这 5 天的天气。

现在我想在此视图上进行输入，以允许用户在按钮中单击输入城市的名称，然后组件 x-weather 应根据搜索到的城市的天气进行更新。但是，页面不应刷新，因为如果页面刷新，将显示基于已验证用户所在城市的天气。

你知道如何在架构方面正确地处理这个问题吗？谢谢！

Answer 1

根据我对问题的理解，你遇到的问题如下：

在页面加载时显示登录用户的天气
然后一旦他们输入所需的位置，系统就会显示该位置而无需刷新页面。

不确定这个解决方案是否适合您，但我提出了一些想法，希望它们对您有用。

控制器：

对于登录用户，控制器将用户位置传递给查看。
创建另一个用于简单调用天气的函数 api 供您输入。

查看：

登录用户的输入自动显示当前位置天气，在文档准备好时调用控制器 api 函数。（或者你可以使用 javascirpt 隐藏它）
Ajax，当用户输入所需的位置，然后使用ajax将位置传递给调用api函数的控制器。当return值成功时，你可以清除原来的内容，然后在不刷新页面的情况下添加任何你想要的内容。

此时不讨论编码细节，但我相信你明白了。

Take a look at ajax

如何正确实现这种情况？

How to properly achieve this scenario?

php

laravel

laravel-livewire