I have a button component that acts as a child component
<template>
<div class="button-container">
<el-button @click="$emit('onClick')" type="primary">{{ text }}</el-button>
</div>
</template>
I am trying to emit the click event so that the parent component can receive it.
Here is the parent component
<script>
import Button from "@/components/Button.vue";
export default {
components: { Button } ,
methods: {
toRegister() { this.$router.push('/register'); }
}
}
</script>
<template>
<Button @on-click="toRegister" text="Register here" textColor="#5fb878" textSize="8px"></Button>
</template>
However, I am not receiving any response from the child component.
I initially thought the issue was with the event name, but even after changing it from onClick
to clicked
, the problem persists.