How to resolve the error: Module '"react-hook-form"' has no exported member 'useForm'

Question

我想使用 react-hook-form 制作简单的登录页面

我收到这个错误：

Module '"react-hook-form"' has no exported member 'useForm'

import React from 'react';
import { Box, TextField } from '@mui/material';
import { SubmitHandler, useForm } from 'react-hook-form';

type InputForm = {
  email: string,
  password: string
}

const Login = () => {
  const { register, handleSubmit } = useForm<InputForm>();
  const onSubmit: SubmitHandler<InputForm> = (data: any) => console.log(data)

  return (
    <Box>
      <form onSubmit={handleSubmit(onSubmit)}>
        <TextField label="email" {...register("email")} />
        <TextField label="email" {...register("password")} />
      </form>
    </Box>
  )
}

export default Login

此代码出现以下错误

TS2305: Module '"react-hook-form"' has no exported member 'useForm'.
    1 | import React from 'react';
    2 | import { Box, TextField } from '@mui/material';
  > 3 | import { SubmitHandler, useForm } from 'react-hook-form';
      |                         ^^^^^^^

但是当我使用简单的 js 文件时它工作正常

Answer 1

您在项目中使用的打字稿版本可能是错误的来源，因为 react-hook-form 说：

Important: Typescript ^4.3 above is the recommended version to work with react hook form. https://react-hook-form.com/ts/

我在这里尝试了您的代码，但没有显示该错误 https://codesandbox.io/s/compassionate-sea-z5sx9u?file=/src/App.tsx

您可以查看 package.json 中使用的版本 https://codesandbox.io/s/compassionate-sea-z5sx9u?file=/package.json

How to resolve the error: Module '"react-hook-form"' has no exported member 'useForm'

How to resolve the error: Module '"react-hook-form"' has no exported member 'useForm'

reactjs

typescript

react-hook-form