Nuxt / Vue : Component call a Method in a page Nuxt / Vue : Component call a Method in a page vue.js vue.js

Nuxt / Vue : Component call a Method in a page


You should emit from your children to your parent

Product.vue

<button @click="emitProductToParent(product.id)">...methods: {  emitProductToParent(id) {    this.$emit('input', id)  }}

Listing.vue

<Product @input="addToSelection" v-for="...." />

You cannot use a method that is not in the component your event listener is on. And even if you could, this is not the way to do. Use:

  • props to pass things down to children
  • emit to pass things up to parents

As explained in the official documentation here: https://vuejs.org/v2/guide/components.html#Listening-to-Child-Components-Events