@conform-to/zod
Zod schema resolver for conform
API Reference
resolve
This resolves zod schema to a conform schema:
import { useForm, useFieldset } from '@conform-to/react';
import { resolve } from '@conform-to/zod';
import { z } from 'zod';
const schema = resolve(
z.object({
email: z.string(),
password: z.string(),
})
);
function ExampleForm() {
const formProps = useForm({
validate: schema.validate
onSubmit: event => {
const payload = new FormData(e.target);
const submission = schema.parse(payload);
console.log(submission.state);
console.log(submission.data);
console.log(submission.form.value);
console.log(submission.form.error);
};
})
const [setupFieldset, { email, password }] = useFieldset({
constraint: schema.constraint
});
}
Or parse the request payload on server side (e.g. Remix):
import { resolve } from '@conform-to/zod';
import { z } from 'zod';
const schema = resolve(
z.object({
}),
);
export let action = async ({ request }) => {
const formData = await request.formData();
const submission = schema.parse(formData);
if (submission.state !== 'accepted') {
return json(submission.form);
}
};
export default function ExampleRoute() {
const formState = useActionData();
}