title: VueJS Simple Alert Appear
body: <p>Can someone help me make this simple alert work? What I wanted was if I click the trigger button, the text would appear but then the component should do its part.</p>
  
  <p>I'm new and learning VueJS and now is in the components part but I haven't fully grasped it yet.</p>
  
  <p>Here's the link: <a href="https://jsbin.com/fefatatemi/edit?html,js,console,output" rel="nofollow noreferrer">JSBIN</a></p>
  
  <p>Snippet of the JS Script</p>
  
  <pre><code>Vue.component('alert', {
    template: '#alert',
      props: {
        errors:false
      },
      data: function() {
        return {
          message:""
        }
      },
      methods: {
        appear: function (status) {
          if(status=="yes") {
            errors = true;
            message = "Appeared";
          }
        }
      }
  });
  
  var myapp = new Vue({
    components: 'alert',
    el: '#app',
    data: {
  
    },
    methods: {
      trigger: function() {
        this.$alert.appear("yes");
      }
    }
  
  
  });
  </code></pre>