로그인 페이지 구현중 문제

허기웅·2024년 2월 27일
0

문제점

id와 password가 비어있을때 로그인 버튼이 비활성화 되게 구현을 했는데 값을 하나씩 줬을때도 버튼이 비활성화됨.
값을 두개 이상 줘야 버튼이 활성화됨.




알아보니 useState로 관리하는 formState를 다시 useState인 isDisabled로 관리하려고 해서 오류가 남.
(쉽게 말해 리렌더링 하는 값으로 다시 리렌더링을 시켜버리면 오류가 날수 있는 확률이 높은데 그 확률에 걸림.)

해결방법

정말 많이 찾아봤다.. gpt에도 수도 없이 물어봤지만 같은말만하고 참 답답했는데 결론은 아주 간단햇다..
그냥 useState를 쓰지 않고 직접적으로 선언해버리면 된다.

그냥 단 한줄..

이렇게 선언해버리고 useState로 끼워넣었던 setIsDisabled들만 싹다 지워주면...


해결.. 답을 알았을때 너무 간단해서 오히려 허탈했다.. 도중에 css를 바꿔서 달라지긴 했지만 코드들은 같다.

도중에 콘솔로 찍어봤는데 리렌더링이 되면서 setIsDisabled로 변경되는게 한박자씩 밀리는거 같았다.
id를 11로 password를 1로 하면 버튼은 활성화 되지만 disabled값은 true로 나왔고 (앞에 쳤던걸 간단하게 3개라 부르겠다)
4개를 치는 순간 false로 바꼈었다. 아마 리렌더링을 리렌더링 하면서 무슨 버그가 있는? 것 같았다..

profile
반가워요.

0개의 댓글