React 登陆表单

54 阅读1分钟

604aa12cf90f4362573287c22ac97bc7.jpg

  const [userInfo, setuserInfo] = useState<User>({})
  const inputChange = (e: any) => {
    const { name, value } = e.target
    setuserInfo((prevState: any) => ({
      ...prevState,
      [name]: value,
    }))
  }
      <form className='form'>
            <div className='input-block'>
              <input className='input' name='username' onChange={inputChange} type='text' id='email' required />
              <label htmlFor='email'>请输入账号/邮箱</label>
            </div>
            <div className='input-block'>
              <input className='input' name='password' onChange={inputChange} type='password' id='pass' required />
              <label htmlFor='pass'>请输入密码</label>
            </div>
            <div className='input-block'>
              <span className='forgot'>
                <a href='#'>忘记密码?</a>
              </span>
              <button>登录</button>
            </div>
          </form>