작성한 질문수 77

0

return setPasswordError(true)를 하셔야 다음 줄이 실행 안 됩니다.

0

어떤부분에서 비밀번호가 다르면 submit이 안되는지 궁금합니다.

지금현재는 패스워드가 달라도 제출은 되는상태입니다.

코드첨부합니다.

const Signup = () => {
  const [email, onChangeEmail] = useInput('');
  const [nickname, onChangeNickname] = useInput('');
  const [password, onChangePassword] = useInput('');

  const [passwordCheck, setPasswordCheck] = useState('');
  const [passwordError, setPasswordError] = useState(false);
  const [term, setTerm] = useState('');
  const [termError, setTermError] = useState('');

  const onChangePasswordCheck = useCallback((e) => {
    setPasswordCheck(e.target.value);
    setPasswordError(password !== e.target.value);
  },[password, passwordCheck]);

  const onChangeTerm = useCallback((e) => {
    setTerm(e.target.checked);
    setTermError(false);
  },[]);

  const onSubmit = () => {
    console.log('=============',password, passwordCheck, '=============')
    if(password !== passwordCheck) {
      setPasswordError(true);
    }
    if(!term) {
      setTermError(true);
    }
    console.log(nickname, email, password);
  }

  return (
    <>
      <AppLayout>
        <Form onFinish={onSubmit}>
          <label htmlFor="user-email">email</label>
          <br />
          <Input name="user-email" required value={email} onChange={onChangeEmail}></Input>

          <label htmlFor="user-nickname">닉네임</label>
          <br />
          <Input name="user-nickname" required value={nickname} onChange={onChangeNickname}></Input>

          <label htmlFor="user-password">비밀번호</label>
          <br />
          <Input name="user-password" required value={password} type="password" onChange={onChangePassword}></Input>

          <label htmlFor="user-passwordCheck">비밀번호체크</label>
          <br />
          <Input name="user-passwordCheck" required type="password" value={passwordCheck} onChange={onChangePasswordCheck}></Input>
          {passwordError && <ErrorMessage>비밀번호가 일치하지 않습니다.</ErrorMessage>}

          <div>
            <Checkbox name="user-term" checked={term} onChange={onChangeTerm} >약관에 동의합니다.</Checkbox>
            {termError && <ErrorMessage>약관에 동의하셔야합니다.</ErrorMessage>}
          </div>
          <div>
            <Button type="primary" htmlType="submit">가입하기</Button>
          </div>
        </Form>
      </AppLayout>
      
    </>

0

password랑 passwordCheck를 먼저 콘솔찍어보세요.

0

혹시 추가질문으로 fornt2 부분에서 sign.js에서 비밀번호가 일치하지 않는 상태에서 가입하기를 눌러도 콘솔이 찍히던데 

어떤부분을 빼먹은걸까요?

혹시 코드가 필요하면 올리겠습니다.

0

모듈은 따로 쓰지는 않고 직접 작성을 많이 합니다. 다만 변경된 약관들도 모두 저장하고 있어야 해서 따로 파일로 저장해놓거나 그렇습니다. 그리고 데이터베이스상에서도 그 사람이 언제 약관동의를 했는지 시간을 기록하는 컬럼이 있어야 나중에 법적 문제가 안 생깁니다.