在输入名称上反应钩子形式 useFieldArray 打字稿错误

时间:2021-04-07 01:39:40

标签: reactjs typescript react-hook-form

我在打字稿中为动态表单编写了以下内容

type FormData = {
    name: string,
    session: { name: string }[]
}

...

const { control, register, handleSubmit } = useForm<FormData>()
const { fields, insert, remove, move, append } = useFieldArray({
    control,
    name: "session",
    keyName: "id"
})

...

{
    fields.map((field, index) => {
        return <div key={field.id}>
            <div>
                <label>Session {index}</label>
                <input type={"text"} {...register(`session.${index}.name`)} />
            </div>
        </div>
    })
}


我在 {...register(session.${index}.name)} 部分收到错误

<块引用>

'string' 类型的参数不能分配给 '"session" 类型的参数 | "姓名" | session.${number} | session.${number}.name'ts(2345)

当我不传入 FormData 时错误消失

const { control, register, handleSubmit } = useForm()

1 个答案:

答案 0 :(得分:2)

在 v7 中,register() 接受文字(确切的字符串值)而不是字符串。因此,将您的代码更改为:

<input type={"text"} {...register(`session.${index}.name` as const)} />

为了避免类型扩展。见const assertions

相关问题: