Compañeros, estoy intentando crear una vista con varios componentes.
Esta es la vista (Home.vue):
<template>
<app-carrusel></app-carrusel>
<app-informacion></app-informacion>
</template>
<script>
import CarruselIndex from '../components/CarruselIndex.vue';
import ComparacionInformacionValtec from '../components/ComparacionInformacionValtec.vue';
export default {
name: 'Principal',
components: {
'app-carrusel': CarruselIndex,
'app-informacion': ComparacionInformacionValtec
},
data: () => ({
menuLateral: false,
}),
}
</script>
Este es el CarruselIndex:
<template>
<v-carousel height="100vh" cycle hide-delimiters show-arrows-on-hover>
<v-carousel-item v-for="(item,i) in items" :key="i" :src="item.src"></v-carousel-item>
</v-carousel>
import bannerCiencia from '../assets/imagenes/carrusel/banner_ciencia.png';
import bannerProductividad from '../assets/imagenes/carrusel/banner_productividad.png';
import bannerTecnologia from '../assets/imagenes/carrusel/banner_tecnologia.png';
export default {
name: 'CarruselIndex',
data: () => ({
slide: 1,
sliding: null,
items: [
{
src: bannerCiencia,
},
{
src: bannerProductividad,
},
{
src: bannerTecnologia,
},
],
}),
};
<template>
<v-container style="width: 100%; background: rgb(89,181,72); background: linear-gradient(180deg, rgba(89,181,72,1) 0%, rgba(35,130,118,1) 100%);" fluid>
<v-layout wrap>
<v-flex xs12 md6>
<h2>¿QUÉ ES VALTEC?</h2>
<p>La plataforma de Valoración de Tecnologías, ValTec, es un aplicativo que ayuda a conocer el estado de maduración de una tecnología. Iniciando desde la idea, hasta llegar al mercado, generando de esta forma innovación. Basado en la guía de TRL, creada por la NASA. Ayuda a los usuarios a conocer el estado real en el que se encuentra su Resultado de Investigación. De esta manera podrá conocer las fases posteriores de investigación, identificando aspectos regulatorios relacionados al Resultado de Investigación, la producción intelectual vinculada a este y el nivel inventivo del Resultado de Investigación.</p>
<p>Se espera que, con el aplicativo, se puedan clasificar los resultados de investigación obtenidos en el marco de la estrategia SENNOVA, generando la información pertinente, como base para la generación de innovación.</p>
<p>ValTec nació como el resultado de un modelo propuesto por el grupo investigación Tecnología y Productividad, liderado por Carlos Alberto Malagón Sánchez y Lady Johanna Malagón Sánchez.</p>
</v-flex>
<v-flex xs12 md6>
<div class="embed-responsive embed-responsive-16by9">
<iframe width="90%" height="300" src="https://www.youtube-nocookie.com/embed/sEtpzPFgvkY?controls=0&rel=0&modestbranding=1" class="rounded-lg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</v-flex>
</v-layout>
</v-container>
</template>
<script>
export default {
name: 'ComparacionInformacionValtec',
};
</script>
Y me arroja este error:
¿Cómo hago para importar varios componentes para la misma vista?