What is emit?

VueJunior~1 min read

emit (or $emit in the Options API) is a mechanism in Vue that lets a child component send events to the parent component.

In simple terms:

emit is a way to tell the parent that something happened in the child component.

This is the main bottom-up channel of communication (child -> parent). In Vue 3, the emit function is used inside setup().

Emit in the Composition API (`setup`)

In setup, emit is passed as the second argument:

export default {
  setup(props, { emit }) {
    function handleClick() {
      emit('clicked', 123)
    }

    return { handleClick }
  }
}

The parent listens:

html

<Child @clicked="onClick" />

Emit in `<script setup>`

Here defineEmits is used:

vue

<script setup>
const emit = defineEmits(['save', 'delete'])

function save() {
  emit('save', { id: 1 })
}
</script>

Emit in the Options API

In the Options API, $emit is used:

methods: {
  handleClick() {
    this.$emit('clicked', 123)
  }
}

A simple example

Child component:

vue

<button @click="emit('increment')">+</button>

Parent:

vue

<Counter @increment="counter++" />

When the user clicks the button, the parent receives the event.

Why is emit needed?

1. Sending data to the parent

For example, the user selected a product:

emit('select', item)

2. Implementing `v-model` in components

A key mechanism in Vue 3:

emit('update:modelValue', newValue)

3. Signaling actions to the parent

For example:

saving
deleting
submitting the form
state changes

4. Support for events in custom components

Emit is a one-directional data flow

Important:

props flow top-down
emit flows bottom-up

This ensures a predictable architecture.

Summary (great for an interview)

Emit is a way to send custom events from a child component to the parent. The Options API uses this.$emit, the Composition API uses emit from setup() or defineEmits(). It's used for sending data, reacting to user actions, and implementing v-model.

Short Answer

Interview ready

Premium

A concise answer to help you respond confidently on this topic during an interview.