Subscribe on changes!

Can't use :is binding with variables when using <script setup>.

avatar
Feb 11th 2022

Version

3.2.30

Reproduction link

sfc.vuejs.org/

Steps to reproduce

Just create a component CompA and something like:

<script setup>
    import CompA from './CompA.vue'
    import { ref } from 'vue'

  // I do NOT want to use [CompA, CompA] because my inputs are strings
    const componentTreeName = ["CompA", "CompA"]
</script>

<template>
  <h1>Demo</h1>
  <template v-for="compName in componentTreeName">
    <component :is="compName"></component>
  </template>
</template>

What is expected?

I expect CompA to appear two times.

What is actually happening?

Observe that the result list is not including CompA.

avatar
Feb 11th 2022
<script>
  import CompA from "./CompA.vue"

  export default {
    components: {
      CompA
    }
  }
</script>
<script setup>
...
</script>
avatar
Feb 11th 2022

Thanks. It's a bit strange to force using a script, isn't it possible to let <script setup> automatically handle this case?