Can someone help me with this issue I'm facing with my components? I have a CustomForm component that has a submit event, but it's only accessible in the parent component. Is there a straightforward solution to get access to the submit event without using an event bus?
This is how my CustomForm.vue looks like:
<template>
<form @submit.prevent="submit">
<slot />
</form>
</template>
<script>
export default {
methods: {
submit() {
this.$emit('onSubmit')
}
}
}
</script>
And here is FormHolder.vue:
<template>
<div>
<CustomForm>
<slot />
<FormSubmit />
</CustomForm>
</div>
</template>
In Page.vue, I want to be able to access the submit event from CustomForm component:
<template>
<FormHolder @onSubmit="submit">
My input fields...
</FormHolder>
</template>