我在NextJS中使用了react 挂钩形式和打字脚本, 这是我的表格钩子

    const schema = yup.object().shape({
        email: yup.string().email().required(),
        password: yup.string().min(8).max(32).required(),
    });

    const { register, handleSubmit, formState } = useForm<IAuthLogin>({
        defaultValues: {
            email: '', // Set initial value for email field
            password: '', // Set initial value for password field
        },
        resolver: yupResolver(schema),
    });

接口

export interface IAuthLogin {
    email: string;
    password: string;
    is_admin: boolean;
}

问题是解析器,我的VS代码在它下面给了我红线,并说, see the screenshot of error

在这种情况下,如何将类型分配给解析程序?

我似乎真的想不出如何为它分配类型,

我查看了Reaction-Hook-Form,here,其中有一个解析器类型定义的示例,

但在我的 case 中,我使用的是YUP来创建模式,请帮助我解决这个问题!

推荐答案

YupResolver的ResolverOptions和您的IAuthLogin接口之间的类型不匹配.ResolverOptions正在try 验证表单值界面中的所有字段,但您的架构仅定义了邮箱和密码字段的验证规则,而不是is_admin字段. 由于您的模式仅为邮箱和密码字段定义了验证规则,因此您应该从接口中删除is_admin字段,因为它不是由该模式验证的.如果您在表单中使用is_admin字段,则可以根据需要单独处理其验证.
或者,如果is_admin不需要验证,则可以在架构中添加is_admin字段,而不对其应用任何验证规则.

const schema = yup.object().shape({
   email: yup.string().email().required(),
   password: yup.string().min(8).max(32).required(),
   is_admin: yup.boolean(), // This keeps is_admin in the schema without validation rules
})

Typescript相关问答推荐

创建一个通用上下文,允许正确推断其中的子项

net::BER_RECTION_REUSED和Uncatch使用Axios和TanStack-Query useMutation时未捕获错误(DelivercMutation)

如何为ViewContainerRef加载的Angular组件实现CanDeactivate保护?

属性的类型,该属性是类的键,其值是所需类型

更新为Angular 17后的可选链运算符&?&问题

如何编写一个类型脚本函数,将一个对象映射(转换)为另一个对象并推断返回类型?

在不更改类型签名的情况下在数组并集上映射文字

Angular NgModel不更新Typescript

如何解决类型T不能用于索引类型{ A:typeof A; B:typeof B;. }'

Angular 15使用react 式表单在数组内部创建动态表单数组

使用动态输出类型和泛型可重用接口提取对象属性

编译TypeScrip项目的一部分导致错误

为什么Typescript只在调用方提供显式泛型类型参数时推断此函数的返回类型?

react 路由不响应参数

如何填写Partial的一些属性并让类型系统知道它?

Vite+Chrome扩展 list v3-;不能在模块外使用import语句;对于inpage脚本

是否使用类型将方法动态添加到类?

对于通过 Axios 获取的数据数组,属性map在类型never上不存在

解析错误:DeprecationError: 'originalKeywordKind' 自 v5.0.0 起已被弃用,无法再使用

创建通过删除参数来转换函数的对象文字的类型