Реакция формы не запускается: отладка проблемы с настройкой в ​​клиентском компоненте ⇐ Javascript

[Anonymous]

Я использую клиентский компонент для отправки данных. Раньше это работало, но вдруг он остановился. Перед этим я помню, как изменял ISBN на ISBN и Authorid на Author_id . Первоначально, я думал, что проблема была с моей настройкой супабазы, но даже простая функция по всему раздачи больше не входит в консоль. < /P>
"use client";

interface BookFormProps {
authors: Author[];
}

const BookForm: React.FC = ({ authors }) => {
const [state, action, pending] = useActionState(addBook, undefined);

// React Hook Form with default values
const form = useForm({
resolver: zodResolver(BookSchema),
defaultValues: {
isbn: "",
author_id: "",
//rest of the values
},
});

//submitting the forms - THIS DOES NOT SHOW
async function onSubmit(data: BookInferSchema) {
try {
console.log("inside the onSubmit function");
console.log(data, "data");
} catch (e) {
console.log(e);
}
}

return (

{/* Testing */}

{
e.preventDefault();
console.log("submitting"); {
form.handleSubmit(onSubmit)(e);
});
}}
>

//the rest of the fields

);
};

export default BookForm;
< /code>
В моем книжном уплотнении нет ошибок: < /p>
import { z } from "zod";

export const BookSchema = z.object({
isbn: z.string().min(10, "ISBN must be at least 10 characters").max(13, "ISBN must not exceed 13 characters"),
length: z.number().positive("Length must be a positive number"),
width: z.number().positive("Width must be a positive number"),
height: z.number().positive("Height must be a positive number"),
publisher: z.string().min(1, "Publisher is required"),
publicationDate: z.date({
required_error: "Please select a data",
invalid_type_error: "That is not a date."
}),
pages: z.number().int().positive("Pages must be a positive integer"),
genre: z.string().min(1, "Genre is required"),
author_id: z.string(), // Reference the Author schema
signed: z.boolean(),
format: z.string().min(1, "Format is required"),
edition: z.string().min(1, "Edition is required"),
productLanguage: z.string().min(1, "Product language is required"),
stocks: z.number().int().positive("Stocks must be a positive integer"),
title: z.string().min(1, "Title is required"),
price: z.number().int().positive("Price must be a positive number"),
description: z.string().min(1, "Description about the book is required"),
bookImageUrl: z.string().url("Invalid URL"),
});

// TypeScript Type for Book
export type BookInferSchema = z.infer;

//Form state for adding and editing books
export type BookFormState =
| {
errors?: {
isbn?: string[];
length?: string[];
width?: string[];
height?: string[];
publisher?: string[];
publicationDate?: string[];
pages?: string[];
genre?: string[];
author_id?: string[];
signed?: string[];
format?: string[];
edition?: string[];
productLanguage?: string[];
stocks?: string[];
title?: string[];
price?: string[];
description?:string[];
bookImageUrl?: string[];
};
message?: string;
}
| undefined;


Подробнее здесь: https://stackoverflow.com/questions/795 ... ient-compo