김건희

[Update] Register Redux Setting

import React, { useCallback, useState } from "react";
import { useDispatch } from "react-redux";
import { register } from "../../../modules/user";
import "../style/RegisterPage.scss"
import { register } from "../../../modules/user.js";
import "../style/RegisterPage.scss";
import { useDispatch, useSelector } from "react-redux";
import { useNavigate } from "react-router-dom";
function RegisterPage(props) {
const dispatch = useDispatch();
const naviagte = useNavigate();
const registerResult = useSelector(state => state.user.registerSuccess);
const [Name, setName] = useState("");
const [Sex, setSex] = useState("");
......@@ -98,20 +102,20 @@ function RegisterPage(props) {
id: Id,
password: Password,
gender: Sex,
};
dispatch(register(UserData));
if (registerResult) {
alert('회원가입에 성공하였습니다.');
naviagte('/login');
} else {
alert('회원가입에 실패하였습니다.');
}
};
dispatch(register(UserData)
.then(res => {
if (res.payload.success) {
props.history.push('/login');
} else {
alert(res.payload.error);
}
})
);
}
}, [checkIdError, checkNameError, checkPasswordError, checkRegisterError, checkSexError, Password, PasswordCheck, Sex]);
}, [checkIdError, checkNameError, checkPasswordError, checkRegisterError, checkSexError, Password, PasswordCheck, Sex, dispatch, registerResult]);
return (
<div id="body">
......
......@@ -14,12 +14,10 @@ const store = createStore(rootReducer, composeWithDevTools());
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<Provider store={store}>
<React.StrictMode>
<BrowserRouter>
<App />
</BrowserRouter>
</React.StrictMode>
</Provider>
<BrowserRouter>
<App />
</BrowserRouter>
</Provider>,
);
// If you want to start measuring performance in your app, pass a function
......
import { combineReducers } from "redux";
import user from "./user";
import user from "./user.js";
const rootReducer = combineReducers({
user,
......
import axios from 'axios';
const REGISTER = 'user/REGISTER';
const LOGIN = 'user/LOGIN'
const InitialState = {
logged: false,
name: 'test',
id: 'test123',
password: 'test1111~',
gender: '1',
};
const LOGIN = 'user/LOGIN';
export function register(data) {
const req = axios.post('http://localhost:4000/register', data)
const req = axios.post('http://localhost:4000/api/register', data)
.then(res => res.data);
return {
type: REGISTER,
payload: req,
}
};
}
export function login(data) {
const req = axios.post('http://localhost:4000/login', data)
const req = axios.post('http://localhost:4000/api/login', data)
.then(res => res.date);
return {
type: LOGIN,
payload: req,
}
};
}
export default function (state = {}, action) {
switch (action.type) {
case REGISTER:
return {...state, success: action.payload};
break;
return { ...state, registerSuccess: action.payload };
case LOGIN:
return {...state, loginSuccess: action.payload};
break;
return { ...state, loginSuccess: action.payload };
default:
return state;
}
};
\ No newline at end of file
}
\ No newline at end of file
......
......@@ -2,7 +2,7 @@ const { createProxyMiddleware } = require("http-proxy-middleware");
module.exports = function(app) {
app.use(
createProxyMiddleware('/', {
createProxyMiddleware('/api', {
target: 'http://localhost:4000', //접속하려는 서버의 루트 URL
changeOrigin: true
})
......