React-hook-form: почему useForm не принимает аргументы типа? - PullRequest
Новая
       19

React-hook-form: почему useForm не принимает аргументы типа?

1 голос
/ 06 мая 2020

Я реализую базовую c форму регистрации пользователя с формой реакции-ловушки в Typescript. Следующий код работает нормально: 

import React, { SyntheticEvent } from "react";
import { RouteComponentProps } from "@reach/router";
import { useForm } from "react-hook-form";

interface Props extends RouteComponentProps {
}

type Inputs = {
  user: {
    name: string;
    email: string;
  }
}

const SignupPage: React.FC<Props> = () => {
  const createUser = (data: Inputs) => console.log(data);

  const { errors, handleSubmit, register } = useForm();

  return(
    <form action="#" onSubmit={handleSubmit(createUser)}>
      <label htmlFor="user[email]">Email address</label>
      <input
        name="user[email]"
        placeholder="johndoe@example.com"
        type="text"
        ref={register({ required: true, pattern: /@/ })}
      />
      {errors.user?.email?.type === "required" && "Email can't be blank"}
      {errors.user?.email?.type === "pattern" && 'Email must include an "@"'}

      <label htmlFor="user[password]">Password</label>
      <input
        name="user[password]"
        placeholder="Minimum 6 characters"
        type="password"
        ref={register({ minLength: 6 })}
      />
      {errors.user?.password && 'Password must be at least 6 characters'}

      <input type="submit" />
    </form>
  );
};

export default SignupPage;

Когда я сталкиваюсь с проблемой, я пытаюсь использовать аргументы типа с useForm. Когда я меняю соответствующую строку на: 

  const { errors, handleSubmit, register } = useForm<Inputs, any>();

... компиляция не выполняется с помощью Expected 0 type arguments, but got 2.

Теперь документация API для response-hook-form предполагает, что это сработает, что Как бы то ни было, документация может быть и часто бывает ошибочной. Но я также смотрю на источник для формы реакции-крючка v5.6.1, что я подтвердил, что использую, и вот как useForm определяется в источнике : 

export function useForm<
  FormValues extends FieldValues = FieldValues,
  ValidationContext extends object = object
>({ 
   // various parameters here 
})

Итак, я думаю, что документы все-таки правильные, а я что-то делаю не так. Маленькая помощь?

...