我正在尝试使用 ChakraUI 和 React-Hook-Form 来创建我的表单。但是,我的错误不起作用。我试过不使用 chakra ui,但它仍然不起作用。这是我的代码:
import React from 'react'
import { useForm } from "react-hook-form";
import "./App.css"
import { Input } from "@chakra-ui/react"
import { Text } from "@chakra-ui/react"
import {
Alert,
AlertIcon,
AlertTitle,
AlertDescription,
} from "@chakra-ui/react"
function App() {
const { register, handleSubmit, errors } = useForm();
const onSubmit = data => console.log(data);
return (
<div className="app-container">
<form onSubmit={handleSubmit(onSubmit)}>
<div className="header-container">
<Text fontSize="3xl" align="center" className="app-header">Finish the survey</Text>
</div>
<div className="email">
<Text fontSize="xl">Your Email</Text>
<Input name="email" placeholder="Your Email..." type="text" ref={register({ maxLength: { value: 23, message: "test" } })} />
{errors.email && (<span>{errors.email.message}</span>)}
</div>
</form>
</div>
)
}
export default App