title: display a flash message with events with vuejs
body: <p>I'm trying to do what is <a href="https://github.com/laracasts/Lets-Build-a-Forum-in-Laravel/commit/5f1b80a2458fd1981a1d8d28674a452e91b47783" rel="nofollow noreferrer">here</a> in the source code, but it is not working.</p>
  
  <p>But event is sent but never received.</p>
  
  <p>Here is the simplest example I could make:</p>
  
  <p>in bootstrap.js:</p>
  
  <pre><code>window.events = new Vue();
  
  window.flash = function (message, level = 'success') {
      console.log('emit'); // This is working
      window.events.$emit('flash', { message, level });
  };
  
  Vue.component('flash', require('./vue/components/Flash.vue'));
  </code></pre>
  
  <p>Flash.vue:</p>
  
  <pre><code>&lt;template&gt;
      &lt;div&gt; MY FLASH&lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      export default {
          created() {
              window.events.$on(
                  'flash', data =&gt; alert('event!!!')
              );
          },
      };
  &lt;/script&gt;
  </code></pre>
  
  <p>and in my view:</p>
  
  <pre><code>&lt;flash&gt;&lt;/flash&gt;
  </code></pre>
  
  <p>I can see in my view the component rendering ie MY FLASH message, but I never get the alert coming from emit!</p>
  
  <p>I also have no error in debugger</p>
  
  <p>Am I missing something? it seems quite simple....</p>