본문 바로가기

Frontend42

[ERROR] Do not use String as a constructor Date를 String으로 변환 시키는 과정에서 발생한 에러이다. var date = new Date(); var month = new String(date.getMonth()); 일단 코드를 짜면서 javascript는 따로 타입 지정이 없다는 사실을 간과하였다.(바보) 단순하게 String만 씌워주면 되는 상황에서 new는 왜 쓴걸까?? Test Code Javascript int to String, Javascript date to String var date = new Date(); typeof date //"object" var month = date.getMonth(); month //7 typeof month //"number" var test = new String(month) test /.. 2021. 8. 20.
React Quill Image Resize Code 2021.04.22 - [[YERIEL] 개발일기/React] - React-Quill Image resize React-Quill Image resize React project 중 Text Editor를 추가하는데 한글 지원 되는 Editor가 React-quill 밖에 없어서 React-quill 적용 중 React Quill로 이미지를 리사이징하기 위해 모듈을 추가하는데 이것때문에 딥빡 할 줄이야...... r-0o0-j.tistory.com 이미 React Quill Image Resize에 대해서 블로그를 썼지만 전체 코드 공유에 대해서 댓글로 요청이 많아서 2탄으로 code에 대한 블로그를 작성하려고 합니다. 제 code는 react 함수형 컴포넌트로 되어 있고 Container - Pres.. 2021. 8. 19.
[React] Html2Canvas를 이용하여 화면 캡쳐하기 a tag와 Html2Canvas 라이브러리를 사용해서 react 화면 캡쳐 기능 만들기 1. a Tag https://developer.mozilla.org/ko/docs/Web/HTML/Element/a - HTML: Hypertext Markup Language | MDN HTML 요소(앵커 요소)는 href 특성을 통해 다른 페이지나 같은 페이지의 어느 위치, 파일, 이메일 주소와 그 외 다른 URL로 연결할 수 있는 하이퍼링크를 만듭니다. developer.mozilla.org a tag의 href와 download를 이용해서 image를 다운 받을 수 있습니다. 2. Html2Canvas https://html2canvas.hertzen.com/ html2canvas - Screenshots .. 2021. 7. 20.
[React] 페이지 이동시 scroll 복귀 history.push를 통해서 page를 이동하는 과정에서 scroll이 아래에 있는 경우 페이지 이동 할 때 그대로 유지가 되는 문제를 발견 어떻게 하면 좋을까 고민하다가 useEffect를 사용해서 component 렌더링시 스크롤을 위로 복귀 시키는 코드 추가 import React, {useEffect} from 'react'; const ScrollOn = ()=>{ useEffect(()=>{ document.getElementById('scroll-container').scrollTop=0; },[]) return ( scroll on ) } id가 scroll-container인 div는 scroll이 생기는 div이고 이 div를 찾아 스크롤 위치를 0으로 지정 해주면 간단히 끝 2021. 5. 20.
React Material-UI Sort Table Custom Hook 이용하기 Material-UI를 이용해서 오름차순, 내림차순이 가능한 정렬 테이블을 만드는 중에 React의 장점 중 하나가 component를 재사용 할 수 있는 것인데 Sort 기능을 사용하기위해서 똑같은 함수를 재선언 하여 사용하고 있는 제 자신을 발견 했습니다. 두 개의 자바스크립트 함수에서 같은 로직을 공유하고자 할 때는 또 다른 함수로 분리하여 사용하는데 React는 자신만의 Hook을 만들면 컴포넌트 로직을 함수로 뽑아내어 재사용할 수 있습니다. 컴포넌트와 Hook 또한 함수이기 때문에 같은 방법을 사용할 수 있습니다! 1. Material-UI Sort Table Material-UI에서 제공하는 Sort Table코드를 제가 사용하기 위해서 분석한 코드 입니다. SortTableContainer... 2021. 5. 11.
[Javascript] {} to [] Javascript Object to List {} : Object [] : List const a = {star:1, moon:2, sun:3} const b = Object.entries(a) console.log(b) //[["star",1] "moon",2], ["sun",3]] const c = Object.keys(a) console.log(c) //["star", "moon", "sun"] const d = Object.values(a) console.log(d) //[1, 2, 3] 2021. 4. 30.
728x90
반응형

티스토리툴바