[Vuejs]-How to access an Vue component within another component?

0👍

To resolve I had to instantiate the Vue again and reference the component…

<template>
  <div id="containerPrincipal" @click.stop="teste">
 ...
<template>

<script>
 /*Other component*/
 import Vue from 'vue'
 import flex_div from './elementos/Div.vue'

 let flexdiv = Vue.component('divFlex', flex_div);

 export default {
  name: 'containerPrincipal',
  methods : {
   teste () {
      let componente = new flexdiv().$mount();
      console.log(componente);
   }
  },
  components: {
   flexdiv 
  }
 }
</script>

0👍

I might be wrong but isn’t this what you want to do?

<template><
  <div id="containerPrincipal" @click.stop="teste">
    <flex-div ref="flex_div"></flex-div>
  </div>
<template>

<script>
 /*Other component*/
 import Vue from 'vue'
 import flexdiv from './elementos/Div.vue'

 export default {
  name: 'containerPrincipal',
  methods : {
   teste () {
      let componente = this.$refs.flex_div
      console.log(componente);
   }
  },
  components: {
   flexdiv 
  }
 }
</script>

Leave a comment