wire:poll

轮询是 Web 应用程序中使用的一种技术，用于"轮询"服务器（按固定间隔发送请求）以获取更新。这是一种保持页面最新的简单方法，无需更复杂的技术如 WebSockets。

基本用法

在 Livewire 中使用轮询非常简单，只需将 wire:poll 添加到元素即可。

以下是一个 SubscriberCount 组件的示例，显示用户的订阅者数量：

<?php

namespace App\Livewire;

use Illuminate\Support\Facades\Auth;
use Livewire\Component;

class SubscriberCount extends Component
{
    public function render()
    {
        return view('livewire.subscriber-count', [
            'count' => Auth::user()->subscribers->count(),
        ]);
    }
}

<div wire:poll>
    Subscribers: {{ $count }}
</div>

通常，此组件将显示用户的订阅者数量，并且在刷新页面之前永远不会更新。然而，由于组件模板上有 wire:poll，此组件现在将每 2.5 秒刷新一次，保持订阅者数量最新。

你还可以通过向 wire:poll 传递值来指定在轮询间隔触发的操作：

<div wire:poll="refreshSubscribers">
    Subscribers: {{ $count }}
</div>

现在，组件上的 refreshSubscribers() 方法将每 2.5 秒调用一次。

时间控制

轮询的主要缺点是它可能会占用大量资源。如果你有一千名访问者在使用轮询的页面上，每 2.5 秒将触发一千个网络请求。

在这种情况下减少请求的最佳方法是简单地延长轮询间隔。

你可以通过在 wire:poll 后附加所需的持续时间来手动控制组件轮询的频率：

<div wire:poll.15s> <!-- 以秒为单位... -->

<div wire:poll.15000ms> <!-- 以毫秒为单位... -->

后台节流

为了进一步减少服务器请求，当页面在后台时，Livewire 会自动节流轮询。例如，如果用户在不同的浏览器标签页中保持页面打开，Livewire 将减少 95% 的轮询请求，直到用户重新访问该标签页。

如果你想退出此行为并继续连续轮询，即使标签页在后台，你可以在 wire:poll 中添加 .keep-alive 修饰符：

<div wire:poll.keep-alive>

视口节流

另一个仅在必要时轮询的措施是在 wire:poll 中添加 .visible 修饰符。.visible 修饰符指示 Livewire 仅在组件在页面上可见时才轮询：

<div wire:poll.visible>

如果使用 wire:visible 的组件位于长页面的底部，它将不会开始轮询，直到用户滚动到视口中。当用户滚动离开时，它将再次停止轮询。

参考

wire:poll
wire:poll="action"

修饰符

修饰符	描述
.[number]s	以秒为单位的轮询间隔（例如，.15s）
.[number]ms	以毫秒为单位的轮询间隔（例如，.15000ms）
.keep-alive	即使标签页在后台也继续轮询
.visible	仅当元素在视口中可见时轮询