인프런 커뮤니티 질문&답변

어디서 문제인지 감이 안잡혀 여쭙습니다

아래는 에러메세지가 발생한 LoginPage.js의 코드입니다.

history 외에는 정상적으로 작동합니다

import React, { useState } from 'react'
// import Axios from 'axios'
import {useDispatch} from 'react-redux'
import { loginUser } from '../../../_actions/user_action';

function LoginPage(props) {
  const dispatch = useDispatch();

  const [Email, setEmail] = useState("");
  const [Password, setPassword] = useState("");

  const onEmailHandler = (event) =>{
    setEmail(event.currentTarget.value)
  }

  const onPasswordHandler = (event) =>{
    setPassword(event.currentTarget.value)
  }

const onSubmitHandler = (event) =>{
  event.preventDefault();

  let body={
    email: Email,
    password: Password
  }
  
  dispatch(loginUser(body))
  .then(response=>{
    if(response.payload.loginSuccess){
      props.history.push('/')
      
    } else{
      alert("Error")
    }
  })
  
}

  return (
    <div style={{
      display: 'flex', justifyContent: 'center', alignItems: 'center',
      width: '100%', height: '100vh'
      }}>
      <form style={{display:'flex', flexDirection:'column'}}
        onSubmit={onSubmitHandler}
      >
        <label>Email</label>
        <input type="email" value={Email} onChange={onEmailHandler}/> 
        <label>Password</label>
        <input type="password" value={Password} onChange={onPasswordHandler}/> 
        <br></br>
        <button>
          Login
        </button>
      </form>
    </div>
  )
}

export default LoginPage