rocketboost_rocketform_useform_hook_quickstart_example.ts

1import React from 'react';
2import { useForm } from '@rocketboost/rocketform';
3
4interface FormValues {
5  username: string;
6  email: string;
7}
8
9const QuickstartForm: React.FC = () => {
10  const { register, handleSubmit, errors } = useForm<FormValues>({
11    initialValues: {
12      username: '',
13      email: '',
14    },
15    onSubmit: (values) => {
16      console.log('Form Submitted:', values);
17    },
18  });
19
20  return (
21    <form onSubmit={handleSubmit}>
22      <div>
23        <label htmlFor="username">Username</label>
24        <input {...register('username')} id="username" />
25        {errors.username && <span>{errors.username}</span>}
26      </div>
27
28      <div>
29        <label htmlFor="email">Email</label>
30        <input {...register('email')} id="email" type="email" />
31        {errors.email && <span>{errors.email}</span>}
32      </div>
33
34      <button type="submit">Submit</button>
35    </form>
36  );
37};
38
39export default QuickstartForm;