When using Vue, I have a main component housing a child component that is loaded onto the page with a button triggering the saveTaskComment() function. Everything works perfectly until it reaches the .finally portion of the child component's function. At this point, I want to make a callback to the parent component in order to call the getInformation method again. However, my current setup using $parent isn't working as expected.
How can I modify the code in the childComponent to successfully call the original function from the parent?
Main Component:
methods: {
getInformation() {
this.$root.$emit('fetchCommentsEvent');
},
}
Child Component:
saveTaskComment() {
/* Function completes and reaches this step without issues */
.finally(() => {
this.$parent.getInformation();
});
}