VueJS 3 Ternary Operation on submitting a form

I was wondering this isn’t working

 <form @submit.prevent="isEditMode? handleEditRole : handleAddRole">

But when I tried

<form @submit.prevent="handleAddRole">

or handleEditRole, its working just fine.

I’m setting the isEditMode to false when the user click the Add Role but then they chose to edit a role then isEdmitMode will be true

>Solution :

Vue will not execute the function when it is returned from a ternary, you have to execute it yourself:

 <form @submit.prevent="isEditMode? handleEditRole($event) : handleAddRole($event)">