title: Vue - Listen to dynamically created channel name
body: <p>I'm trying to integrate Laravel-Vue-Pusher based notification and <a href="https://laravel.com/docs/5.4/broadcasting#concept-overview" rel="nofollow noreferrer">laravel's broadcasting documentation</a> has been very helpful.</p>
  
  <p>So we create an laravel <code>event</code>, <code>trigger and broadcast</code> it on a <code>Pusher</code> channel.</p>
  
  <p>On the Javascript side, we use <code>Echo</code> to listen for event broadcasts. </p>
  
  <p>Here's some example-code for from the documentation:</p>
  
  <pre><code>Echo.private(`order.${orderId}`)
      .listen('ShippingStatusUpdated', (e) =&gt; {
          console.log(e.update);
      });
  </code></pre>
  
  <p>I tried using it in Vue and it threw an <code>ReferenceError: orderId is not defined</code>.</p>
  
  <p>On the Laravel side, here's the <code>event</code> that's broadcasting it on that channel:</p>
  
  <pre><code>public function broadcastOn()
  {
      return new PrivateChannel('order.'.$this-&gt;order-&gt;id);
  }
  </code></pre>
  
  <p>Event is fired successfully and it also gets logged in Pusher Dashboard.</p>
  
  <p>But i'm unable to figure out why i'm getting missing <code>orderId</code> error in Vue. Any help would be appreciated.</p>