[update] Update Login page (If login is success, go to main page)
Showing
3 changed files
with
17 additions
and
9 deletions
... | @@ -6,11 +6,11 @@ | ... | @@ -6,11 +6,11 @@ |
6 | // ------------------------------------ | 6 | // ------------------------------------ |
7 | // 이렇게 나눠진 다양한 reducer을 combineReducers을 통해 rootReducer에서 하나로 합쳐주는 기능을 만들 것임. | 7 | // 이렇게 나눠진 다양한 reducer을 combineReducers을 통해 rootReducer에서 하나로 합쳐주는 기능을 만들 것임. |
8 | import { combineReducers } from 'redux'; | 8 | import { combineReducers } from 'redux'; |
9 | -// import user from './user_reducer'; // user(회원가입, 로그인, 인증, 로그아웃 기능이 있음) reducer | 9 | +import user from './user_reducer'; // user(회원가입, 로그인, 인증, 로그아웃 기능이 있음) reducer |
10 | // import comment from './comment_reducer'; // comment기능이 있을 때 reducer | 10 | // import comment from './comment_reducer'; // comment기능이 있을 때 reducer |
11 | 11 | ||
12 | const rootReducer = combineReducers( { | 12 | const rootReducer = combineReducers( { |
13 | - | 13 | + user |
14 | }) | 14 | }) |
15 | 15 | ||
16 | // 다른 곳에서도 rootReducer을 쓸 수 있도록 | 16 | // 다른 곳에서도 rootReducer을 쓸 수 있도록 | ... | ... |
... | @@ -10,8 +10,7 @@ export default function (prevState = {}, action) { | ... | @@ -10,8 +10,7 @@ export default function (prevState = {}, action) { |
10 | return {...prevState, loginSuccess:action.payload} // 위의 prevState를 그대로 가져오고, | 10 | return {...prevState, loginSuccess:action.payload} // 위의 prevState를 그대로 가져오고, |
11 | // user_action.js에 있는 payload를 그대로 가져와서 return. | 11 | // user_action.js에 있는 payload를 그대로 가져와서 return. |
12 | break; | 12 | break; |
13 | - | ||
14 | default: | 13 | default: |
15 | - break; | 14 | + return prevState; |
16 | } | 15 | } |
17 | } | 16 | } |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -4,15 +4,15 @@ import React from 'react' | ... | @@ -4,15 +4,15 @@ import React from 'react' |
4 | import {useState} from 'react' | 4 | import {useState} from 'react' |
5 | import {useDispatch} from 'react-redux'; | 5 | import {useDispatch} from 'react-redux'; |
6 | import {loginUser} from '../../../_actions/user_action' | 6 | import {loginUser} from '../../../_actions/user_action' |
7 | +import { withRouter } from 'react-router-dom'; | ||
7 | 8 | ||
8 | -function LoginPage() { | 9 | +function LoginPage(props) { |
9 | 10 | ||
10 | 11 | ||
11 | // 이 로그인페이지 안에서 input에 타이핑을 함으로써 데이터를 변화시켜주므로 state 사용. | 12 | // 이 로그인페이지 안에서 input에 타이핑을 함으로써 데이터를 변화시켜주므로 state 사용. |
12 | // 1-1. state을 사용하기 위해 state 만들어줌. | 13 | // 1-1. state을 사용하기 위해 state 만들어줌. |
13 | - const initialState = ""; | 14 | + const [Email, setEmail] = useState(""); // 1-2. email을 위한 state |
14 | - const [Email, setEmail] = useState(initialState); // 1-2. email을 위한 state | 15 | + const [Password, setPassword] = useState(""); // 1-2. password를 위한 state |
15 | - const [Password, setPassword] = useState(initialState); // 1-2. password를 위한 state | ||
16 | //1-3. 아래 input value에 넣어줌 | 16 | //1-3. 아래 input value에 넣어줌 |
17 | 17 | ||
18 | // 2-1. 타이핑할 때 타이핑 하는 거 보이게 하도록 핸들러를 만들어줌 | 18 | // 2-1. 타이핑할 때 타이핑 하는 거 보이게 하도록 핸들러를 만들어줌 |
... | @@ -37,6 +37,15 @@ function LoginPage() { | ... | @@ -37,6 +37,15 @@ function LoginPage() { |
37 | } | 37 | } |
38 | 38 | ||
39 | dispatch(loginUser(logInfo)) // _actions폴더 user_action.js에 있음 | 39 | dispatch(loginUser(logInfo)) // _actions폴더 user_action.js에 있음 |
40 | + .then(response => { | ||
41 | + if(response.payload.loginSuccess) | ||
42 | + props.history.push('/'); | ||
43 | + | ||
44 | + else | ||
45 | + alert('Error'); | ||
46 | + | ||
47 | + | ||
48 | + }) | ||
40 | 49 | ||
41 | } | 50 | } |
42 | return ( | 51 | return ( |
... | @@ -58,4 +67,4 @@ function LoginPage() { | ... | @@ -58,4 +67,4 @@ function LoginPage() { |
58 | ) | 67 | ) |
59 | } | 68 | } |
60 | 69 | ||
61 | -export default LoginPage | 70 | +export default withRouter(LoginPage) | ... | ... |
-
Please register or login to post a comment