Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

91
Vistas
$emit not being caught by listener

I'm having an issue here that I can't seem to fix: I would like to have a simple toggle for a component using $emit

this is my index.vue :

    <div
      v-for="(filteredArticles, categoryKey) in groupedCategories"
      :key="categoryKey"
      class="l"
      @listen-button-event="toggle"
    >
      <CategoryWrapper :title="categoryKey" />
    </div>
  methods: {
    toggle () {
      alert('I did something')
      console.log('ping')
      this.isActive = !this.isActive
    }
  }

this is my component :

    <div
      :class="{ active: isActive }"
      @click="changeComponent()"
    >
      <a>{{ title }}</a>
    </div>
  data () {
    return {
      isActive: false
    }
  },
  methods: {
    changeComponent () {
      this.$emit('listenButtonEvent')
    }
  }

Doesn't seem to do anything...

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

listen-button-event shouldn't be on the div it should be on the CategoryWrapper Component.

<div
  v-for="(filteredArticles, categoryKey) in groupedCategories"
  :key="categoryKey"
  class="l"
  
>
  <CategoryWrapper :title="categoryKey" @listen-button-event="toggle" />
</div>
about 4 years ago · Juan Pablo Isaza Denunciar

0

Listeners need to be camelCas'ed like this

<CategoryWrapper :title="categoryKey" @listenButtonEvent="toggle" />

and not kebab-case'ed.

As you can see in the Vue devtools, since you're emitting listenButtonEvent here.

enter image description here


A better convention being emitting a update:listenButtonEvent btw, cannot find an official recommendation for that one again.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda