title: how to render component from a component in vue js
body: <p>I have a component with following template:    </p>
  
  <pre><code>    &lt;div v-for:"item in store" v-bind:key="item.type"&gt;
         &lt;a&gt;{{item.type}}&lt;/a&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>I have another component called 'StoreComponent'
  On click of a element in first component I want to clear the current component and show the StoreComponent and able to pass item.type to StoreComponent.</p>
  
  <p>I don't want to use router-link or router.push as I don't want to create a new url but override the current component with the new one depending on the item.type value.</p>
  
  <p>StoreComponent.vue</p>
  
  <pre><code>     export default{
          name: 'StoreComponent',
          props: ['item'],
          data: function () {
            return {
               datum: this.item
             }
          },
         methods: {
            //custom methods
         }
      }
  </code></pre>