본문 바로가기
반응형

React18

Modal이 Mouse Focus에 따라 사라지는 현상 - 해결 👌 이전에 다른 에러를 처리하면서 짧은 코멘트로 이상하게 마우스 포커스가 다른 화면으로 넘어가면 Show 상태이던 Modal이 자꾸 사라진다는 글을 남긴 적이 있다. 다른 부분들을 처리하면서 그 부분은 그렇게 방치해뒀는데 다른 메뉴 부분에서 동일하게 Modal을 처리하다가 이번에는 사라지지 않는다는 것을 발견하고 무언가 차이점을 캐치한듯한 느낌이 들었는데! 혹시 Modal 태그가 위치한 부분의 차이 때문에 발생하는 문제인가? 하는 추측으로 태그 위치를 옮겨주었더니 허무하게 해결되어버렸다. 100% 정확하다고 말할 수 없지만 내가 이해한 바로는 Show 상태를 보이도록 제어할 때만 출력되는 Modal이기 때문에 태그의 위치가 전혀 상관없다고 판단하여 동작되고 있는 태그 근처에 대충 위치시켜두었는데 아무래도 M.. 2023. 2. 12.
공공 API 호출 중 발생한 Axios 500 Error 공공 API를 사용하려고 호출하던 중 Axios 에러 중 500 에러가 발생했다. Axios 관련 에러가 악명이 높다고 여러 블로그 글들에서 봐왔기 때문에 일단 겁부터 났지만 CORS 관련 에러는 모두 처리해서 더이상 나지 않았는데 큰 산을 넘고 나니 500... 미천한 지식으로는 500 에러는 보통 Parameter에 적절한 값들이 들어있지 않아 Bad Request가 뜰때 발생하는 에러로 알고 있는데 관련 API 가이드를 수십번 확인하고 Parameter를 정확하게 맞춰줬는데 계속 에러가 발생한다... 에러 내용을 자세히 보니 'Service Not Found. The request may have been sent to an invalid URL... 이하 생략' 이란 내용이 있는데 아무래도 주소줄.. 2023. 2. 8.
Element 내부의 Element 정렬 나의 경우 A 태그 내부의 한 행에 Span 태그와 Button 태그가 존재하는데 Span 태그가 좌측으로 붙어 있을 경우 Button 태그를 오른쪽 끝으로 붙이고 싶었다. 약간 시간이 걸려 찾게 되었고 이 방법이 정석인지는 모르겠으나 Button의 상위 태그에 Display 속성의 값을 'inline-block'으로 주고 정렬하고 싶은 Button 태그에 float 속성 값으로 'right'를 주니 해결되었다. 코드로 간략히 예시를 보여주자면 블라블라 블라블라 와 같이 작성하니 처리 되었다. 2023. 1. 16.
Error : Excountered two children with the same key ... 위와 같은 에러를 만났다. 반복문 등으로 요소를 만들어 낼때 자식요소에 중복이 생겨서 발생하는 에러인듯 하다. 실제 내 코드에서는 필요한 목록을 반복문으로 리스트를 만들고 있었는데 필요에 따라 분기를 해줬었는데 고려 안했던 부분이 분기문을 모두 통과하면서 Key가 중복되어 발생한 이슈였다. 전체 Component 내에서 반복이 안돼야 하는 것이 아니기 때문에 해당 Logic 내에서 Key가 겹치지 않도록 처리해 주었더니 깔끔하게 사라졌다. 2023. 1. 13.
반응형