2024/03/04

react 에서 이중 모달창 띄우기

[ 2024/03/04 ]

디버깅을 하면서 우선 어떤 로직에서 수행되어야 하는지 판단하였다.

콘솔로그로 찍어가면서 어디서 수행되어야 하는지 판단 후에 임의로 설정되어 있었던 화면을 return 해주도록 하였다.

2번의 경우에는 로직을 따라가다보니 action에서 close를 하고 있었으므로, 자동으로 닫히는게 로직 중 일부였다.

1번의 경우는 submit을 하게 될경우 성공/실패 여부에 따라 모달창을 content 가 변경 되도록 하면 될 것 같았다.

그래서 해당 로직에서 바로 결과에 따라 원하는 화면을 return 하도록 해주었다.

2번의 경우는 action에서 close해주던 것을 우선 지워주어 자동으로 닫히는 로직을 변경 하였고, timeOut을 이용하여 2-3초 정도 후에 닫히도록 로직을 변경해주었다.

나는 action에서 진행하지않고 해당 container에서 진행하도록 하였다.

정상적으로 요구사항에 맞게 submit 결과에 따라 성공/실패 화면이 사용자에게 보인다.

그리고 로직을 따라가며 어디서 어떻게 수행되는지, 어디서 어떤 행동이 수행되면 좋은지에 대해 로직 수정도 할 수 있었다.

그리고 mount 관련 오류가 발생하는데 이 부분은 나중에 정리해두려고 한다!

파트장님한테 여쭤보니 state가 무너지면 이 세상이 무너진다가 react의 세상이라고 해주셨다. ㅋㅋ

참고하여 조금 더 공부 후에 적용하여 에러나는 부분을 해결하고 정리해둘 예정이다.

두번째 맡아보는 스프린트 task 이지만 아직 어려움이 많았고, 조금 더 수정할 부분이 있어보이기 때문에 많은 어려움이 있을 것 같다고 예상된다....

하지만 프로그래밍 언어만 다를 뿐 다 비슷하다고 느껴져서 흥미가 생기고 있는 것 같다.