title: Components handed via props in vue3
body: <p>In Vue 2 I had a custom routing solution that involved in some cases handing in components as props.</p>
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
      &lt;div&gt;
          &lt;component :is=&quot;component&quot; :data=&quot;componentData&quot;/&gt; 
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
      props: {
          component: {}
          componentData: {}
      }
  }
  &lt;/script&gt;
  </code></pre>
  <p>In vue 3 this gives the warning: &quot;Vue received a Component which was made a reactive&quot;.</p>
  <p>Is there a way of avoiding this warning?  Is it possible to dynamically add components to a component?</p>
  <p>If you have an array of components that is not globally registered in App.components is it possible to render them without warnings?</p>
  <p>Here is an older question about this in Vue2:
  <a href="https://stackoverflow.com/questions/42992579/is-it-possible-to-pass-a-component-as-props-and-use-it-in-a-child-component-in-v">Is it possible to pass a component as props and use it in a child Component in Vue?</a></p>
  <p>Note the above code works fine in Vue2, this question is specifically about Vue3.</p>