개인공부/메인프로젝트15 카카오맵 - 드디어 검색기능 성공!!!!! 드디어 카카오지도 검색 기능 성공했다. 진짜 하루종일 잡고 있었네................ 몇번을 고치고 한지 모르겠다 //Map // 지도 컴포넌트 import React, { useEffect } from "react"; declare global { interface Window { kakao: any; } } interface SearchProps { Place: string; } const MapComponent: React.FC = ({ Place }) => { useEffect(() => { const infowindow = new window.kakao.maps.InfoWindow({ zIndex: 1 }); const container = document.getElementById(".. 2023. 5. 16. 카카오맵이용 - 사용자 현재위치조회 카카오맵을 이용해서 사용자의 현재위치를 조회할수 있게 마커까지 표시되어 뜨게 구현했다. 단점이 있다면 크롬에서만 가능하다는 거다! 카카오에서 제공하는 문서이다. var mapContainer = document.getElementById('map'), // 지도를 표시할 div mapOption = { center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표 level: 10 // 지도의 확대 레벨 }; var map = new kakao.maps.Map(mapContainer, mapOption); // 지도를 생성합니다 // HTML5의 geolocation으로 사용할 수 있는지 확인합니다 if (navigator.geolocation) {.. 2023. 5. 16. 카카오 지도 연결하기 지도 컴포넌트 생성 // map.tsx import React, { useEffect } from "react"; declare global { interface Window { kakao: any; } } const MapComponent: React.FC = () => { useEffect(() => { const container = document.getElementById("map"); const options = { center: new window.kakao.maps.LatLng(33.450701, 126.570667), level: 3, }; const map = new window.kakao.maps.Map(container, options); }, []); return ( ); }; e.. 2023. 5. 14. 페이지네이션 구현 (마이페이지) 드디어 페이지네이션 구현을 배웠다!!!!!!!!!!! 일단 내가 꾸며둔 마이페이지의 찜리스트 페이지(likepage)에서는 Table이라는 컴포넌트를 따로 만들어뒀고 , 그걸 Table컴포넌트를 가져다가 likepage안에서 사용했다. 일단 axios를 이용해서 데이터를 가져오자. useEffect(()=>{ axios .get(`${process.env.REACT_APP_API_URL}/members/favorite`, { headers: { "Content-Type": "application/json", Authorization: localStorage.getItem("authToken"), "ngrok-skip-browser-warning": "69420", //ngrok cors 에러 }, }) .. 2023. 5. 13. 이전 1 2 3 4 다음
