Laravel Broadcasting with Pusher isn't Listening with Vue

With Laravel (v5.7) I'm trying to get Broacasting to Work with Pusher and Vue.

The App is like a Chat. When there is a message send in a private chat, the following function is called: broadcast(new NewChat($message));

This is the "NewChat"-Event:

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];
    }
}

The channels.php has:

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

It sends it all to Pusher:

But I can't figure out how to correctly listen to the Events with Vue and update it all. The following I've added in the boostrap.js (it's all written in Vue the app):

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);
    });

In the example I hardcoded the number 1 for the private channel, because that's the same channel as from the screenshot.

What am I missing? I re-read the documentation page multiple times and tried following tutorials to see if I've skipped something small, but don't know. Anyone who sees what I'm missing?