Skip to content

useForm composable ​

useForm<T> composable allow you to create Type-safe forms with autocomplete. You can also use infered type from yup, zod, valibot etc...

Usage ​

vue
<script lang="ts" setup>
import { useForm, FormType } from 'vue-formify';
/*---------------------------------------------
/  TYPES
---------------------------------------------*/
type FormInput = {
  title: string;
  user: {
    name: string;
    email: string;
  }
}
/*---------------------------------------------
/  VARIABLES
---------------------------------------------*/
const form = ref<FormType<FormInput>>();
const send = (data: FormInput) => {
  console.log(data);
};
const { Form, Field } = useForm<FormInput>();
</script>
<template>
	<Form
      ref="form"
      @submit="send">
        <Field name="title" />
        //       ^ will show autocomplete with 'title' | 'user.name' | 'user.email'
        <button>Send</button>
  </Form>
</template>