代码之家 › 专栏 › 技术社区 › Jan Wolfram

useFieldArray不能赋值给never类型

next.js forms reactjs

Jan Wolfram · 技术社区 · 5 月前

嘿,我正在React中使用useForm构建一个动态表单。不知怎么的,我有一个无法修复的打字错误,即使有很多示例代码和文档。我创建了一个zod验证文件。看起来是这样的:

import { z } from "zod";

export const PollValidation = z.object({
  text: z
    .string()
    .min(5, { message: "Minimum 5 characters." })
    .max(400, { message: "Maximum 400 characters." }),
  options: z
    .array(
      z
        .string()
        .min(5, { message: "Minimum 5 characters per option." })
        .max(400, { message: "Maximum 400 characters per option." })
    )
    .min(2, { message: "At least 2 options are required." }),
});

我正在使用useForm和useFieldArray,如下所示:

const form = useForm<z.infer<typeof PollValidation>>({
    resolver: zodResolver(PollValidation),
    defaultValues: {
      text: poll ? poll?.text : "",
      options: ["Option 1", "Option 2"]
    },
  });

  const { fields, append, remove } = useFieldArray<
    z.infer<typeof PollValidation>
  >({
    control: form.control,
    name: "options" as const,
  });

实际上,代码和我的表单正在按预期运行,但当我为字段数组设置名称时:

name: "options" as const,

我遇到了这个错误:

类型“options”不能分配给类型“never”。

fieldArray.d.ts(6,5):预期的类型来自属性“name”,该属性在类型“UseFieldArrayProps”上声明;{text:string;options:string[];},never,“id”>'

谢谢你的帮助:)

1 回复 | 直到 5 月前

KiraLT 5 月前

不幸的是 useFieldArray 仅支持对象数组。如果将选项更改为对象数组,它将工作:

export const PollValidation = z.object({
    options: z
        .array(
            z.object({
                value: z.string()
            })
        )
})

您还可以在以下网址找到此问题 their github