VUE, поскольку приносить archivo.vue сдержись мне

Я начинаюсь с VUE и мне не удается понять, как делать, чем с файла, который называется modales.vue, где они мой modale, им удается принести это в мой компонент в части template моего index.js.

Он мог бы делать это буквальным способом с '' но останься очень мало понятным. возможно делать это таким образом, которое я пробую, или он не я не знаю много vue следовательно не, правилен ли он.

Это файл 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>
0
задан 24.12.2019, 17:12
1 ответ

Что ты можешь, ты заставляешь меняться приклеиваешь этикетку на template поэтому:

<script type="text/x-template" id="mi-compo">
  // ...
</script>

И ты cГіdigo verГ - в asГ-:

<script type="text/x-template" id="mi-compo">
    <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>
</script>

<script>
Vue.component('mi-compo',{
    template: '#mi-compo',                    
    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,
      }
  },
});
</script>
0
ответ дан 24.12.2019, 21:45
  • 1
    я немного потерян это должно быть в файле index.js или в .vue, моем неведении, если я меняю этикетку, сдержись из-за нее < рукописный шрифт type =" text/x-template" пойдите =" mi-compo" > текст html остается все в мишени и он я очень трудный для того, чтобы прочитать, потому что он не остается с highlighting html, Мне не будет хватать какого-то import или export – jonathan 24.12.2019, 15:06