在使用对象数组时,连接 yup 和 react-hook-form 的名称
P粉743288436
P粉743288436 2023-08-17 21:56:44
[React讨论组]


我正在尝试通过registerreact-hook-formyup的模式连接起来,但是遇到了一个错误。我的目标是传递一个类似于exampleArray${index}.exampleProp的名称,因为我将在循环中渲染输入框。

一个简单的例子:

import * as yup from "yup";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";

const schema = yup.object().shape({
  exampleArr: yup.array().of(
    yup.object().shape({
      exampleProp: yup.string()
    })
  )
});

type FormValues = yup.InferType<typeof schema>;

export default function App() {
  const methods = useForm<FormValues>({
    resolver: yupResolver(schema)
  });
  return (
    <input type="text" {...methods.register("exampleArr[0].exampleProp")} /> // error here
  );
}

类型'"exampleArr[0].exampleProp"'的参数不能赋值给类型'"exampleArr" | exampleArr.${number} | exampleArr.${number}.exampleProp'。

codesandbox中的示例:https://codesandbox.io/s/funny-orla-97p8m2?file=/src/App.tsx

P粉743288436
P粉743288436

全部回复(1)
P粉312631645

你需要告诉exampleArr.${number}的类型是什么:

例如,我刚在你的沙盒上测试了一下,它运行得很好:

<input type="text" {...methods.register("exampleArr[0].exampleProp" as any)} />
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号