Problem Statement
How do child components communicate back to parents in Vue?
Explanation
Children emit custom events that parents listen to. In Vue 3, define emits for better type safety and dev warnings. Use $emit in Options API or the emit function from setup in the Composition API. Parents bind listeners with v-on/@.
Code Solution
SolutionRead Only
// Child.vue (Vue 3)
<script>
export default {
emits: ['submit'],
methods: { onClick(){ this.$emit('submit', { ok: true }) } }
}
</script>
<!-- Parent.vue -->
<Child @submit="handleSubmit" />