본문 바로가기

error/Frontend6

[react] useState에 전개연산자로 이전의 값 넣기 const [img, setImg] = useState([]); // 커버 이미지 /**이미지 onchange 함수*/ const uploadChange = (e) => { const arr = [...img, ...e.target.files]; setImg(arr); } /**이미지 업로드 구현 */ const onImgUpload = async () => { console.log(img); }; }; 업로드 2023. 2. 16.
[react] geolocation + kakakoAPI로 현재 위치 찾기 문제 상황 및 해결 geolocation으로 어떻게 해야 하는 지 몰랐는데 아래 코드로 쉽게 해결.. // 알아낸 좌표가 있을 때 const success = (position) => { console.log('위도', osition.coords.latitude,'경도', position.coords.longitude); }; // 알아낸 좌표가 없을 때 const error = (err) => { console.warn(`${err.message}`); }; navigator.geolocation.getCurrentPosition(success, error, options); 그리고, 받은 좌표 값으로 kakao API에 요청! // 알아낸 좌표로 kakaoAPI 요청 const success = (p.. 2023. 2. 14.
[react] material-ui/core랑 material-ui/icons 설치 문제 상황 React 버전 문제 때문에 자꾸 에러 나서 구글링 한 결과 npm install @material-ui/core --legacy-peer-deps npm install @material-ui/icons-material --legacy-peer-deps app.js에서 import Fab from "@material-ui/core/Fab"; import SendIcon from "@material-ui/icons/Send"; 2023. 2. 9.
[React] antd 모달로 로그인 창 구현(antd modal signin) React 프로젝트 개발 구현 문제 상황 ant- design 으로 그냥 로그인 페이지, 그냥 모달 페이지는 많이 있는데 모달로 로그인 구현하는게 많이 힘들었다.. 삽질 계속 하다가.. 나중에 까먹지 않게 남겨놓기.. 처음에는 header안에 넣어놨는데 리액트니까 컴포넌트로 따로 빼놓자..해서 처음부터 다시 했다.. input창은 그냥 복사붙여넣기 하면 된다.(나중에 유효성 검사도 넣어야지) - 배운 것 : 부모 컴포넌트 => 하위 컴포넌트로 props 값 넘기는 거는 알았는데 하위 컴포넌트 => 부모 컴포넌트로 state값 변경하는 것 알게 되었다! 함수로 사용했다! 1. Modal.js(하위 컴포넌트) import React from 'react'; import { Modal, Input, Form .. 2023. 1. 28.
el태그로 반복문 처리할 때 오류(feat jsp 표현식) 문제 상황 페이징 처리를 하는데(부트스트랩 사용) 처음에 Prev와 Next 버튼은 적용이 안됐는데 부분은 적용이 안됐다. for문으로 돌려서 값이 잘 나왔지만 누르면 넘어가야 하는데 안넘어가고 이상한 숫자가 넘어와서 넘어가지 않았다. JSP파일 Prev Prev ${p} ${p} Next Next JS파일 JS파일에서는 JSP el 표현식을 사용할 수 없어서 1}"> Prev ${p} ${p} Next Next 변경하고 난 뒤의 JS파일 function goPrev(gp, category){ let goPrev = gp-1; location.href="/board/shareAndReqList?currentPage="+goPrev+"&category="+category+""; } function goPa.. 2022. 4. 12.
페이징처리를 할 때 안 넘어가는 이유(For input string:2") Validation failed for object='pagingVO'. Error count: 1 org.springframework.validation.BindException: org.springframework.validation.BeanPropertyBindingResult: 1 errors Field error in object 'pagingVO' on field 'currentPage': rejected value ['2']; codes [typeMismatch.pagingVO.currentPage,typeMismatch.currentPage,typeMismatch.int,typeMismatch]; arguments [org.springframework.context.support.Defau.. 2022. 4. 12.