Digamos que tenemos una estructura de archivos como esta:
app / ├── App.vue ├── componentes / │ index.js │ ├── Type1.vue │ ├── Type2.vue │ └── Type3.vue …
Y dentro de App.vue, queremos cargar un componente basado en una propiedad que se le haya pasado, denominada componentName
En mi caso, sabía que la cadena componentName solo coincidiría con uno de los nombres de los componentes en la carpeta de componentes. Entonces, App.vue puede seleccionar el componente correcto como este:
// App.vue
Con componentes / index.js:
// components / index.jsexport {predeterminado como Tipo1} desde './Type1.vue' exportar {predeterminado como Tipo2} desde './Type2.vue' exportar {predeterminado como Tipo3} desde './Type3.vue'
Y eso es.
Ahora puede seleccionar dinámicamente un componente basado en una variable prop.