import axios from 'axios' import { useEffect, useState } from 'react' import { Link, Redirect } from 'react-router-dom' import userApi from '../apis/user.api' import catchErrors from '../context/catchError' const INIT_USER = { name: '', email: '', password: '', checkpw: '', phone: '', } const Signup = () => { const [user, setUser] = useState(INIT_USER) const [error, setError] = useState('') const [disabled, setDisabled] = useState(false) const [success, setSuccess] = useState(false) useEffect(() => { setDisabled(!(user.name && user.email && user.password && user.checkpw)) }, [user]) function handleChange(event) { const { name, value } = event.target setUser({ ...user, [name]: value }) // console.log('user정보', user) } async function handleSubmit(e) { e.preventDefault() try { // console.log('checkPassword:',checkPassword()) // const passwordMatch = checkPassword() if (checkPassword()) { const res = await userApi.signup(user) console.log('서버연결됬나요', res) console.log('회원가입') setSuccess(true) setError('') } } catch (error) { console.log('에러발생') catchErrors(error, setError) } finally { // setLoading(false); } } function checkPassword(event) { const p1 = user.password const p2 = user.checkpw if (p1 !== p2) { alert('비밀번호가 일치하지 않습니다.') return false } else { return true } } if (success) { alert('회원가입이 완료되었습니다!') return ; } const { name, id, password, checkpw, phone } = user return (
회원가입
{error &&
{error}
}
{/* {console.log(disabled)} */}
) } export default Signup