title: Dynamic component in Vue3
body: <p>A simple working example of a Vue2 dynamic component</p>
  <pre class="lang-js prettyprint-override"><code>
  &lt;template&gt;
      &lt;div&gt;
          &lt;h1&gt;O_o&lt;/h1&gt;
          &lt;component :is=&quot;name&quot;/&gt;
          &lt;button @click=&quot;onClick&quot;&gt;Click me !&lt;/button&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      export default {
          data: () =&gt; ({
              isShow: false
          }),
          computed: {
              name() {
                  return this.isShow ? () =&gt; import('./DynamicComponent') : '';
              }
          },
          methods: {
              onClick() {
                  this.isShow = true;
              }
          },
      }
  &lt;/script&gt;
  </code></pre>
  <p>Everything works, everything is great. I started trying how it would work with the Composition API.</p>
  <pre class="lang-js prettyprint-override"><code>&lt;template&gt;
      &lt;div&gt;
          &lt;h1&gt;O_o&lt;/h1&gt;
          &lt;component :is=&quot;state.name&quot;/&gt;
          &lt;button @click=&quot;onClick&quot;&gt;Click me !&lt;/button&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      import {ref, reactive, computed} from 'vue'
  
      export default {
          setup() {
              const state = reactive({
                  name: computed(() =&gt; isShow ? import('./DynamicComponent.vue') : '')
              });
  
              const isShow = ref(false);
  
              const onClick = () =&gt; {
                  isShow.value = true;
              }
  
              return {
                  state,
                  onClick
              }
          }
      }
  &lt;/script&gt;
  </code></pre>
  <p>We launch, the component does not appear on the screen, although no errors are displayed.</p>