title: Dynamically add a child component in Vue JS
body: <p>I need some help in <code>Vue JS</code> and <code>Laravel</code> with adding a child vue component.</p>
  
  <p>I have a parent component called "wrapper" and some child components called like <code>"show-1"</code>, <code>"show-2"</code>, <code>"show-3"</code> ... etc.</p>
  
  <p><strong>Parent component:</strong></p>
  
  <pre><code>&lt;template&gt;
      &lt;div class="card border-light"&gt;
          &lt;div class="card-header"&gt;
              &lt;h5 class="title"&gt;{{ title }}&lt;/h5&gt;
          &lt;/div&gt;
          &lt;div class="card-body"&gt;
              &lt;component
                  is="view"
              &gt;&lt;/component &gt;
          &lt;/div&gt;
          &lt;div class="card-footer"&gt;&lt;/div&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
      props : ['title'],
      data() {
          return {
              view : ''
          }
      }
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>An exmaple child component like "show-1":</p>
  
  <pre><code>&lt;template&gt;
      &lt;div&gt; show-1 &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>This code below is in blade for rendering wrapper component with a dynamic child component name:</p>
  
  <pre><code>&lt;wrapper
  title="Example"
  view="show-1"
  &gt;&lt;/wrapper&gt;
  </code></pre>
  
  <p>This code is not working but if i change the parent view data "show-1" instead of empty, it works. why ?</p>
  
  <p>When I change the view prop, child vue component should be changed too. How could I do this ?</p>
  
  <p>I want to pass the view attribute to parent component dynamically.</p>