Vue.js Pass Data To Parent Component
Send data from the Child Component to Parent Component using the $emit() method.
STEP 01: Invoke the $emit()
method in the child component where you want to send a piece of the data to its parent component.
this.$emit('name', "Raja Tamil");
The first argument is the $event name and the second argument is the actual data that you want to pass to the parent component.
STEP 02: Use the same $event name prefixed with the @ symbol where you define the child component inside the template in the parent component.
<ChildComponent @name="getName"/>
The value of it will be a function and it will have the actual value returned in its argument.
STEP 03: Declare the getName function inside the methods objects with an argument.
methods: {
getName(value) {
console.log(value); // Raja Tamil
}
}