在这里，我尝试使用 react-hook 表单构建一个注册表单。我正在尝试为自己的目的建立一个餐厅网站。但我已经尝试了很多次。但我遇到了很多错误。如果有人能帮助我，那就太好了。有很多错误需要解决。

有人能帮忙吗？

这是 signup.js 文件

import React, { useEffect, useState } from 'react';
import { useAuth } from './useAuth'
import { useForm } from 'react-hook-form';
import logo from '../../Images/logo2.png';
import './SignUp.css'

const SIgnUp = () => {

    const [returningUser, setReturningUser] = useState(false);
    const {register, handleSubmit, watch, errors} = useForm();
    
    const auth = useAuth();

    const onSubmit = data => {
        if(returningUser){
            if(data.email && data.password){
            auth.signIn(data.email, data.password)
            }
        }
        else{
            if(data.name, data.email, data.password){
                auth.signUp(data.name, data.email, data.password)
            }
        }
    }
    return (
        <div className="sign-up">
            <div className="container">

            <div className="logo-container ">
                <img src={logo} alt=""/>

            </div>
            {
                returningUser ?
                <form onSubmit={handleSubmit(onSubmit)} action="" className="py-5">
                    
                    {
                        auth.user != null && <p className="text-danger">{auth.user.error}</p>
                    }
                    <div className="form-group">
                        <input type="text" name="email" className="form-control" {...register( {requried: true})} placeholder="Email"/>
                        {errors.email && <span className="error">Email is Required</span>}
                    </div>
                    <div className="form-group">
                        <input type="password" name="password" className="form-control" {...register({requried: true})} placeholder="password"/>
                        {errors.password && <span className="error">Password is Required</span>}
                    </div>
                    <div className="form-group">
                        <button className="btn btn-danger">Sign In</button>
                    </div>
                    <div className="option text-center">
                        <label  onClick={() => setReturningUser(false)}>Create a new Account</label>
                    </div>



                </form>
                :
                <form action="" onSubmit={handleSubmit(onSubmit)}>
                    <div className="form-group">
                        <input type="text" name="name" className="form-control" 
                       
                       {...register({requried: true})} placeholder="Name"/>
                        {errors.name && <span className="error">Name is Required</span>}
                    </div>
                    <div className="form-group">
                        <input type="password" name="password" className="form-control" {...register({requried: true})} placeholder="Confirm password"/>
                        {errors.password && <span className="error">Password is Required</span>}
                    </div>
                    <div className="form-group">
                    <button className="btn btn-danger">Sign Up</button>


                    </div>
                    <div className="option text-center">
                        <label onClick={() => setReturningUser(true)}>Already have an account!</label>
                    </div>


                </form>
            }

            </div>
        </div>
    );
};

export default SIgnUp;

以下是错误：

SIgnUp
T:/1.Full-Stack-Developer/5.React/3.Red Onion/red-onion-resturant/src/components/SignUp/SIgnUp.js:65
  62 | :
  63 | <form action="" onSubmit={handleSubmit(onSubmit)}>
  64 |     <div className="form-group">
> 65 |         <input type="text" name="name" className="form-control" 
     | ^  66 |        
  67 |        {...register('name', {requried: true})} placeholder="Name"/>
  68 |         {errors.name && <span className="error">Name is Required</span>}