Estoy empezando con VUE y no logro entender como hacer que desde un archivo que se llama modales.vue donde están mi modale lograr traerlo a mi componente en la parte del template de mi index.js.
Podría hacerlo de manera literal con las `` pero queda muy poco comprensible. es posible hacer esto de esta manera que intento o no es no conozco mucho de vue por tanto no se si es correcto.
Este es el archivo index.js
Vue.component('mi-compo',{
template: `<p>como traigo el archivo modales.vue donde esta el modal que necesito</p>`,
data(){
return{
unidad:'',
};
},
methods:{
close: function () {
this.$emit('close');
this.unidad = '';
this.dialog = false;
}
}
});
new Vue({
el: '#app',
vuetify: new Vuetify(),
data () {
return {
tab: null,
text1: 'Lorem ipsum dolorconsequat.',
text2:'CREA TU SOLICITUD',
icons: false,
}
},
});
aqui el arvhivo modales.vue
<template>
<v-row justify="center">
<v-dialog v-model="dialog" persistent max-width="600px">
<template v-slot:activator="{ on }">
<v-btn color="primary" dark v-on="on">CREAR NUEVA SRM</v-btn>
</template>
<v-card>
<v-card-title>
<span class="headline">DATOS SRM</span>
</v-card-title>
<v-card-text>
<v-container>
<v-row>
<v-col cols="12" sm="6">
<v-select
v-model="unidad"
:items="['B1', 'B2', 'B3', 'B4']"
label="Unidad*"
required
></v-select>
</v-col>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="blue darken-1" text @click="close()">Close</v-btn>
<v-btn color="blue darken-1" text @click="dialog = false">Save</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</v-row>
</template>
<mi-compo></mi-compo>
. Puedes tener cada cosa en archivos separados, sólo preocúpate de cargar vue.js y vuetify antes que el resto. Y cuando estés cómodo, puedes usar importación de módulos ES6. – ffflabs el 24 dic. 19 a las 23:51