Snippet

Declaring Custom Events with defineEmits

To send data from a child component back to its parent, you must declare the events the component can fire using defineEmits.

snippet.js

javascript

<script setup>
const emit = defineEmits(['close', 'submit']);
 
function handleAction() {
  emit('submit', { id: 1 });
}
</script>

vue

Breakdown

const emit = defineEmits(['close', 'submit']);

Defines the specific events this component is allowed to trigger.

emit('submit', { id: 1 });

Triggers the 'submit' event and passes an object as a payload.