[Vuejs]-How to call methods from the parent component in child in vuejs

by

0👍

Based on $emit event in Vue.js: https://vuejs.org/guide/components/events.html

When you emit an event like this: $emit(‘someEvent’), the parent someEvent function will fire (and also you can pass some parameters).

So you must listen to the ‘someEvent’ function in parent.

EDIT: this link would be a good example: https://learnvue.co/tutorials/vue-emit-guide

0👍

Here is a basic example working with events

Child.vue

<template>
 <button @click="$emit('childClick')">click me</button>
</template>

Parent.vue

<script setup>
import { ref } from 'vue'
import Child from './Child.vue'
  function onChildClick(){
    console.log("child has clicked")
  }
</script>

<template>
  <Child @childClick="onChildClick"></Child>
</template>

Leave a comment