vue3 使用component is 动态组件

使用方式

父组件

<template>
  <div class="box">
    <div>
      <!-- setup需要用变量的方式来写入is，如果是options api方式可以用组件字符 -->
       <!-- myProps 属性可以直接传到动态组件 -->
      <component :is="childT" myProps="sldfjsklfjksfjsfj"/>
    </div>
  </div>
</template>
<script lang="ts" setup>

import childT from "./components/childT.vue";


</script>
<style lang="stylus" scoped></style>

子组件:childT.vue

<template>
  <div class='box'>
    childT
  </div>
</template>
<script lang='ts' setup>
// import { ref, reactive, computed, onMounted, nextTick } from 'vue';


const props = defineProps<{
  myProps: string,
}>();

console.log(props.myProps,"ldsnvlsdjfskdjfsfdj");
</script>
<style lang='scss' scoped></style>