import { useState } from "react"; import styles from "./login.module.scss"; import { Redirect } from "react-router-dom"; import catchErrors from "../../utils/catchErrors"; import { useAuth } from "../../context/auth_context.js"; const Login = () => { const { login, guestLogin, loading } = useAuth(); //useState를 이용해서 각 state 생성 및 초기값 저장 const [state, setState] = useState(true); // 이 줄은 css에 해당하는 state //state변수 지정 하지만 이 변수는 react에 의해 없어지지 않음, 그리고 그 다음 변수는 state변수를 갱신해주는 함수 const [user, setUser] = useState({ id: "", password: "" }); const [error, setError] = useState(""); const [success, setSuccess] = useState(false); const [guest, setGuset] = useState({ guestName: "", guestEmail: "", guestBirthday: "", guestMbnum: "", guestPassword: "" }) //input태그에 걸려있는 onchange에서 실행할 함수설정 const handleLoginOnChange = (e) => { // ... 전개 연산자 // 현재 state에 방금 변화한 값을 다시 저장함 setUser({ ...user, [e.target.name]: e.target.value }) }; const handleGuestOnChange = (e) => { setGuset({ ...guest, [e.target.name]: e.target.value }) } const requestServer = async (data) => { try { if (data === user) { const success = await login(data); if (success) { setSuccess("member"); alert('로그인이 완료되었습니다.') } } else { const success = await guestLogin(data); if (success) { setSuccess("guest"); alert('로그인이 완료되었습니다.') } } } catch (error) { catchErrors(error, setError); } } const handleOnSummit = async (e) => { e.preventDefault(); try { setError(""); if (e.target.name === "login") { requestServer(user); } else { requestServer(guest); } } catch (error) { catchErrors(error, setError); } } if (success === "member") { return ; } else if (success === "guest"){ return ; } return (
로그인
{/* 로그인 */} {/* 비회원예매 학인 */}

※ 비회원 정보 오 입력 시 예매 내역 확인/취소 및 티켓 발권이 어려울 수 있으니 다시 한번 확인해 주시기 바랍니다.

) } export default Login