반응형
1. ~/home 입장시 navigation.geolocation 함수를 통해 유저의 위치를 획득한다.
현재위치를 리코일 전역state 인 atom 을 사용 하여 nowLocation , defaultPosition에 할당한다.
setDefaultPosition 함수를 카카오톡 온클릭 메소드에 등록하여 지도 클릭시마다 변경되도록 하였다.
useEffect에 할당하고 의존성배열을 빈배열로 하여 렌더링시 한번만 실행되도록 함.
2. 리코일에서는 defaultPosition atom을 getWTM selector가 참조하도록 하였다. getWTM은 위경도를 평면좌표로 바꾸어주는 순수함수이다. 지도에 온클릭이벤트가 발생하여 defaultPosition이 변경되면 이를 참조하는 getWTM selector가 실행된다.
3. 서버는 유저의 위치를 평면좌표로 전달받아 반경10km에 있는 관광지배열을 응답으로 보내준다.
4. 응답으로 전달받은 관광지배열을 카카오맵과 모니터에 리스트업한다.
반응형
'프로젝트 > 코드스테이츠 - 4주프로젝트' 카테고리의 다른 글
| 리팩토링 : 지도 위주의 UI로 변경 (0) | 2022.01.05 |
|---|---|
| 리팩토링 : useResetRecoilState 이용하여 지도 클릭시 지역검색창 초기화되도록 함 (0) | 2022.01.03 |
| 리팩토링 : httpOnly를 true로 설정하고 로긴상태 유지하는법 알아냄 (0) | 2022.01.01 |
| 리팩토링 : 카카오맵 연속클릭시 하얀지도뜨는 버그 해결 (0) | 2021.12.25 |
| useMemo와 React.memo를 이용한 최적화 (0) | 2021.12.19 |
