我正在使用useFieldArray从我的后端API获取默认值。我的类别是一个字符串数组。但是,Reaction-Hook-Form只支持对象数组。这是我的 Mongoose 的图式
type BookDocument = Document & {
title: string
description: string
categories: string[]
language: string
publicationYear: number
}
const bookSchema = new Schema(
{
title: { type: String, required: true },
description: { type: String, required: true },
categories: [{ type: String, requried: true }],
language: { type: String, required: true },
publicationYear: { type: Number, required: true },
},
{ timestamps: true }
)
因此,我不得不从前台修改我的表单如下:
type FormData = {
title: string
description: string
categories: { category: string }[]
language: string
year: number
}
const {
handleSubmit,
control,
formState: { errors },
} = useForm<FormData>({
mode: 'onBlur',
defaultValues: {
title: book.title ?? '',
description: book.description ?? '',
categories:
book.categories.map((elem) => {
return { category: elem }
}) ?? '',
language: book.language ?? '',
year: book.publicationYear ?? '',
},
})
问题是什么时候调用API请求。网络有效负载将如下所示,因此无法发送到后端
1条答案
按热度按时间qncylg1j1#
您可以调用已解构为常量的
handleSubmit
函数(在代码片段中的control
之上)。您可以选择在哪里调用handleSubmit
--可能是在表单上的按钮上--而不是只调用handleSubmit
,您可以 Package 一个回调,如下所示:在本例中,
wrappedSubmit
只是一个接受data
的回调。Data是React挂钩形式传递给handleSubmit
的参数对象。因此,您可以在wrappedSubmit
回调中修改数据对象,并让handleSubmit获取结果。我必须做一些类似的事情。希望这能帮上忙。