LivewireはLaravelEchoとうまく連携し、WebページにWebSocketを使用したリアルタイム機能を提供します。
この機能はLaravel
Echoがインストールされており、window.Echoオブジェクトがグローバルに利用可能であることを前提としています。詳細は以下のLaravelイベントについて考えてみます。
class OrderShipped implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
public function broadcastOn()
{
return new Channel('orders');
}
}このイベントをLaravelのブロードキャストシステムで次のように発行するとします。
event(new OrderShipped);通常、Laravel Echoでこのイベントを次のようにリッスンします。
Echo.channel('orders')
.listen('OrderShipped', (e) => {
console.log(e.order.name);
});ただし、Livewireを使用する場合は、Echoから発行されていることを指定するための特別な構文を使用して、$listenersプロパティに登録するだけです。
class OrderTracker extends Component
{
public $showNewOrderNotification = false;
// Special Syntax: ['echo:{channel},{event}' => '{method}']
protected $listeners = ['echo:orders,OrderShipped' => 'notifyNewOrder'];
public function notifyNewOrder()
{
$this->showNewOrderNotification = true;
}
}これで、LivewireはPusherから受信したイベントをインターセプトし、それに応じて動作します。同様の方法で、プライベート／プレゼンスチャネルにブロードキャストされたイベントをリッスンできます。