모바일 메뉴 오픈 시 스크롤 방지
·
React
모바일 메뉴가 화면에 나오면 스크롤이 일어나지 말아야 할 때도 있다. 스크롤 방지를 안 하면  스크롤 방지모바일 메뉴가 보이면 body에 스타일을 주어 스크롤을 방지한다.// 모바일 메뉴 오픈시 스크롤 방지 useEffect(() => { if (showMobileMenu) { document.body.style.overflowY = "hidden"; document.body.style.position = "fixed"; document.body.style.width = "100%"; document.body.style.height = "100%"; } else { document.body.style.position = "relative"; ..
map(), filter(), find()
·
Javascript
자주 사용하고 있는 map()과 filter()에 대해 정리해 보았다.반복이 필요하면 map(), 조건에 만족하는 모든 요소가 필요하면 filter() ,조건에 만족하는 첫 번째 요소만 필요하면 find()를 사용하면 된다.map()배열 내의 모든 요소 각각에 대하여 주어진 함수(callback 함수) 적용 후 새로운 배열을 반환한다.문법 : arr.map(callback(currentValue[, index[, array]])[, thisArg]) (Optional - index, array, thisArg)const array = [1, 4, 8, 12, 16];const parameters = array.map((x, index, arr) =>{console.log(x, index,arr)})//결..
react-highlight
·
React
블로그 제작 시 코드 문을 잘 보이게 하기 위해서 highlight.js라이브러리를 사용하다가 react문에서는 적절하게 표현되지 않아 최종적으로 react-highlight 라이브러리를 적용했다. react-highlight npm react-highlightReact component for syntax highlighting. Latest version: 0.15.0, last published: 2 years ago. Start using react-highlight in your project by running `npm i react-highlight`. There are 200 other projects in the npm registry using react-highlight.www.npm..
minsun309
minsun