laravel - Pusher を使用した Laravel Broadcasting が Vue でリッスンしない

Question

Laravel (v5.7) を使用して、Broacasting を Pusher と Vue で動作させようとしています。

アプリはチャットのようなものです。プライベート チャットでメッセージが送信されると、次の関数が呼び出されます。 broadcast(new NewChat($message));

これは「NewChat」イベントです。

class NewChat implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    public $message;

    public function __construct(\App\Message $message)
    {
        $this->message = $message;
    }

    public function broadcastOn()
    {
        return new PrivateChannel('chats.' . $this->message->conversation_id);
    }

    public function broadcastWith()
    {
        return ['message' => $this->message];
    }
}

持っていchannels.phpます：

Broadcast::channel('chats.{conversationId}', function ($user, $conversationId) {
    return true; // security i'll do later
});

すべてを Pusher に送信します。

しかし、Vue でイベントを正しくリッスンしてすべてを更新する方法がわかりません。以下をboostrap.jsに追加しました（すべてVueアプリで記述されています）：

import Echo from 'laravel-echo'
window.Pusher = require('pusher-js');
window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER, 
    encrypted: true
});
window.Echo.private(`chats.1`)
    .listen('NewChat', (e) => {
        console.log(e);
    });

この例では、プライベート チャネルの番号 1 をハードコーディングしました。これは、スクリーンショットと同じチャネルであるためです。

私は何が欠けていますか？ドキュメンテーション ページを何度も読み直し、次のチュートリアルを試して、小さなことをスキップしたかどうかを確認しましたが、わかりません。私が欠けているものを見る人はいますか？