> 해결된 에러라면 라벨에 'Complete' 를 달아주세요.
> 미해결된 에러라면 라벨을 'In progress' 로 변경해주세요.

### 어떤 에러인가요?
- state too many re render

### 에러 메시지

- 리액트에서 setState를 같은 함수내에서 여러번 사용하면 state too many re render 에러를 발생한다.

### 에러 핸들링 방법

- state는 비동기 처리 되기 때문에 같은 setState 계속 하게 되면 랜더링이 너무 많아 리액트가 막는다.
- state를 여러개 만들어서 사용합니다.

```js
import React, { useState } from "react";
import axios from "axios";

axios.defaults.withCredentials = true;

function Mypage({ userInfo, handleResponseUpdate }) {
//todo: 수정하기 버튼 click하면 input/완료버튼 표시

// 로그인시 사용자 정보 props로 전달됨
const mypageUserinfo = { ...userInfo };

// 사용자가 입력하는 값
const [updateInfo, setUpdateInfo] = useState({
password: null,
nickname: null,
phone: null,
});
// 에러메세지 화면표시
const [errorMessage, setErrorMessage] = useState("");

const handleInputValue = (key) => (e) => {
setUpdateInfo({ ...updateInfo, [key]: e.target.value });
};

// 서버에 pacth요청
const handleUpdate = () => {
if (!updateInfo.password || !updateInfo.nickname || !updateInfo.phone) {
setErrorMessage("모든항목을 입력해주세요.");
} else {
axios
.patch(
"https://localhost:4000/users/update",
{
password: updateInfo.password,
nickname: updateInfo.nickname,
phone: updateInfo.phone,
},
)
.then((res) => {
if (res.data.message === "ok") {
handleResponseUpdate();
alert("수정이 완료 되었습니다. 다시 로그인 하세요.");
}
});
}
};
// 로그인안하고 강제로 mypage로 접속시 막음
if (!mypageUserinfo.email) {
return (

export default Mypage;

```