<script setup lang="ts">
interface Props {
schema: Object,
state: Object,
}
async function onError (event: FormErrorEvent) {
const element = document.getElementById(event.errors[0].id)
element?.focus()
element?.scrollIntoView({ behavior: 'smooth', block: 'center' })
}
</script>
<template>
<UForm
:schema="schema"
:state="state"
:validate-on="['submit']"
@submit="$emit('submit')"
@error="onError"
>
<slot></slot>
</UForm>
</template>
<script setup lang="ts">
interface Props {
schema: Object,
state: Object,
}
async function onError (event: FormErrorEvent) {
const element = document.getElementById(event.errors[0].id)
element?.focus()
element?.scrollIntoView({ behavior: 'smooth', block: 'center' })
}
</script>
<template>
<UForm
:schema="schema"
:state="state"
:validate-on="['submit']"
@submit="$emit('submit')"
@error="onError"
>
<slot></slot>
</UForm>
</template>