feat(Form): add superstruct validation (#2357)

This commit is contained in:
rizkyyy
2024-10-11 16:02:51 +07:00
committed by GitHub
parent 428ee44fc0
commit 3cda6c6478
5 changed files with 81 additions and 3 deletions

View File

@@ -0,0 +1,36 @@
<script setup lang="ts">
import { object, string, nonempty, type Infer } from 'superstruct'
import type { FormSubmitEvent } from '#ui/types'
const schema = object({
email: nonempty(string()),
password: nonempty(string())
})
const state = reactive({
email: '',
password: ''
})
type Schema = Infer<typeof schema>
async function onSubmit (event: FormSubmitEvent<Schema>) {
console.log(event.data)
}
</script>
<template>
<UForm :schema="schema" :state="state" class="space-y-4" @submit="onSubmit">
<UFormGroup label="Email" name="email">
<UInput v-model="state.email" />
</UFormGroup>
<UFormGroup label="Password" name="password">
<UInput v-model="state.password" type="password" />
</UFormGroup>
<UButton type="submit">
Submit
</UButton>
</UForm>
</template>