[UForm] How can i access to submitter?

[ldiellyoungl]

Description

Hello. How can i access to submitter in UFrom?

my code:

<script setup>
async function onSubmit(event) {
  switch (event.submitter.name) {
    case 'create':
      //some logic
      break;
    case 'update':
      //some logic
      break;
    case 'delete':
     //some logic
      break;
  }
}
</script>
<template>
  <UForm @submit="onSubmit">
    <UButton v-if="isCreateForm"  type="submit"name="create">
       create
    </UButton>
    <UButton  type="submit"name="update">
      update
    </UButton>
    <UButton  type="submit"name="delete">
      delete
    </UButton>
  </UForm/>
<template>

event i get:

[DarlanPrado]

Hey bro, I looked at your question, compare it with this code

https://github.com/nuxt/ui/blob/dev/docs/components/content/examples/FormExampleElements.vue

As you can see there is only one submit button on the form, the clear button calls a separate function

By closely observing the function of the component that makes the emit, we can see that the way it was done, it is impossible to know which of the buttons were clicked. so currently the component does not have support to do this

Submit Function in https://github.com/nuxt/ui/blob/dev/src/runtime/components/forms/Form.vue#L129

async function onSubmit (payload: Event) {
const event = payload as SubmitEvent
try {
if (props.validateOn?.includes('submit')) {
await validate()
}
const submitEvent: FormSubmitEvent = {
...event,
data: props.state
}
emit('submit', submitEvent)
} catch (error) {
if (!(error instanceof FormException)) {
throw error
}
const errorEvent: FormErrorEvent = {
...event,
errors: errors.value.map((err) => ({
...err,
id: inputs.value[err.path]
}))
}
emit('error', errorEvent)
}
}