title: Passing props dynamically to dynamic component in VueJS
body: <p>I've a dynamic view: </p>
  
  <pre><code>&lt;div id="myview"&gt;
    &lt;div :is="currentComponent"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>with an associated Vue instance:</p>
  
  <pre><code>new Vue ({
    data: function () {
      return {
        currentComponent: 'myComponent',
      }
    },
  }).$mount('#myview');
  </code></pre>
  
  <p>This allows me to change my component dynamically.</p>
  
  <p>In my case, I have three different components: <code>myComponent</code>, <code>myComponent1</code>, and <code>myComponent2</code>. And I switch between them like this:</p>
  
  <pre><code>Vue.component('myComponent', {
    template: "&lt;button @click=\"$parent.currentComponent = 'myComponent1'\"&gt;&lt;/button&gt;"
  }
  </code></pre>
  
  <p>Now, I'd like to pass props to <code>myComponent1</code>.</p>
  
  <p>How can I pass these props when I change the component type to <code>myComponent1</code>?</p>