title: How to destroy vuejs component from outside of component
body: <p>I have created one of component in vuejs something like this</p>
  
  <pre><code>    var tree_data = Vue.extend({
          template: '#tree_data_template',
          props: [
              'groupmodal',
              'search-name',
              'tree-id'
          ], // props in single quotes
          data: function () {
              return {
                  shared: d2d.store
              };
          }
      });
  </code></pre>
  
  <p>And use this component in another template like this.</p>
  
  <pre><code>var template_data = Vue.extend({
  template: '#template_data',
  created: function () {
      var self = this;
      self.shared.setCurrentRoute('templates');
  },
  components: {
      'tree-data': tree_data
  },
  data: function () {
      return {
          id: this.$route.params.id,
          shared: d2d.store,
      };
  },
  methods: {
      destroyComponent: function () {
          //Need to code for destroy tree-data component
      }
  }
  });
  </code></pre>
  
  <p>Blade file code</p>
  
  <pre><code>&lt;tree-data 
       groupmodal="false"                 
       search-name="user_search" 
       tree-id="user_tree" 
  &gt;
  &lt;/tree-data&gt;
  </code></pre>
  
  <p>So finally how can i destroy my "tree-data" component through the "destroyComponent()" method</p>