킹바구니 🦜

간단하게 말해서 빠르게 쓸 수 있는 단축키같은거라고 보면 된다. 예를들어 dq라고 입력하고 탭키를 누르면 document.querySelector()가 자동으로 써진다거나 이러한 기능이다. 1. 파일 - 기본 설정 - 사용자 코드 조각 구성 열으시오 js.code-snippets 검색 후 엔터 2. 원하는 스니펫 추가 { "Print to console": { // 제목 "scope": "javascript,typescript", // 적용 범위 "prefix": "cd", // 단축어 "body": [ "console.dir($1);", // 내용 ], "description": "Log output to console" // 설명 }, } 복붙해서 쓰면 되는데 단축어와 내용이 중요함. 특히 내용 안에..

예를들어 검색input과 검색버튼에 같은 함수를 건거라고 보면 됨. 그 대신 input은 keydown이벤트로, 버튼은 click이벤트로 걸어서 keydown일때는 엔터키 체크하고 click은 그냥 검색하고 뭐 그런식으로 하려는데 자꾸 에러가 나는 것임. 1. as로 걸어주기 if (e.type == "keydown" && e.code == "Enter") { gotoPage(v); return; } if (e.type == "click") { gotoPage(v); } 이건 고치기 전임 if (e.type == "keydown" && (e as React.KeyboardEvent).code == "Enter") { gotoPage(v); return; } if (e.type == "click") { g..

let arr = useRef([]); arr.current = text.replace(" ", "").split(","); // 에러 배열을 하나 만들어서 어떤 텍스트를 배열화한걸로 대체하려고 했는데 위와 같은 메세지가 뜨더라. arr가 []배열이라고 다 써놨는데 뭐가 문제지?? 1. 배열에 어떤 인자가 들어오는지 상세하게 알려주기 // useRef에 쓰는 예시 let arr = useRef([]); // 모르겠다 대충 넘어가자 let arr = useRef([] as any);

undefined 형식은 number 형식에 할당할 수 없습니다. undefined 형식은 string 형식에 할당할 수 없습니다. a = b 이렇게 a에 b를 할당하려고 하는데, a가 number고 b가 string이라 b를 숫자로 바꿔서 넣는다고 쳐보자. 근데 b가 또 undefined가 될 수 있다 이딴~~~소리를 하면서 에러가 뜨는데 그냥 이런건 조건 걸어서 걔가 undefined아닐때~ 이렇게 써주면 되는데 한줄로 쓰는 방법은 아래와 같음. 1. 한줄로 쓰는 법 const cnt = (settings.cnt !== undefined) ? parseFloat(setting.cnt) : 2; 넹

타스로 쓰다보면 자꾸 빨간줄이 생기는데 일단 첫번째 1. getItem에 에러날 경우 const item = JSON.parse(sessionStorage.getItem(k)!); 뒤에 느낌표를 쓰기. 2. key에 에러날 경우 // 반복문이라서 i가 있음 const k = sessionStorage.key(i); if (k && k.includes('user')) {}; 첫번째는 따로 변수로 받아서 if문에서 갸가 있을 경우~를 써주고 처리하면 된다. if (sessionStorage.key(i)?.includes('user')) {} 변수로 처리하기 싫다면 이렇게 물음표를 key뒤에 붙이면 됨!

아 형 또 왜그래요 1. 좀 더 자세한 조건 추가 if (this.view.api?.getText) { this.view?.api?.getText(text); } 좀 더 설명하자면 view의 api에 아무것도 없다가 페이지가 로드되면 getText가 생기는데, 이 타이밍을 못기다리고 getText는 없다며 '정의되지 않음' 이하 경고멘트를 띄운 것임. 그렇기때문에 getText가 있을때~를 조건으로 걸고 그 안에 하고싶은걸 넣어주면 됨. 거의 다 이런식의 오류인듯.

잘 또 하다가 갑자기 발생하는 오류... 잘쓰던 useRef를 다른 엘리먼트로 옮긴것뿐인데 왜그러지 싶었는데 타입스크립트는 엘리먼트가 그냥 div냐 main header같이 다른 시멘틱 엘리먼트냐를 또 가르나봄. 나 열받게하지마라! 1. useRef값 확인 const wrapper = useRef(null); // 기존. 에 걸어뒀음. const wrapper = useRef(null); // 변경. 에 걸어둠.

useRef로 element좀 써주려고 하면 이렇게 뜬다. 그냥 current가 있을 때를 조건으로 걸어주면 된다. 1. 미리 걸러주기 if (inputRef.current) { // 이곳에 코드 쓰기 } 참고로 나는 정의할때 이렇게 썼음 const inputRef = useRef(null); +추가로 이렇게 썼는데 여전히 그 밑에서 current가 null일 수 있다 이소리를 한다면 느낌표를 활용하자. if (inputRef.current) { gotoPage(inputRef.current!.value); } 느낌표의 의미는 'null일리없으니까 그대로 진행시켜'라는 의미라고 함.

움짤처럼 마우스로 캔버스 클릭 시 그 부분이 중심점이 되어 자동으로 원이 그려지고 다른 곳 클릭 시 원 하나가 확정되어 그려짐. 이후 다른 중심점을 잡으면 새로운 원도 그리면서 동시에 원래 그렸던 원도 기억해서 그려주는 내용임. 캔버스는 도대체 어떻게 작동이 되나 싶었는데 원리가 기존 원을 냅두고 새로 그리는게 아니라 싹 지워버리고 다시 다 그리는 것이였음... https://codepen.io/pmx/pen/qBvZQOV 마우스 위치에 따라 모양 그리고 기억하기 ... codepen.io 이건 진짜 새발의 피고 파면 팔수록 진짜 어렵다 이런 인터렉션.....

먼소리야 도대체...는 별거아니고 그냥 형변환 해달라는 의미임. 1. 숫자형으로 바꿔주기 const n = +inputRef.current.value - 5; 아주 빠른건 이렇게 앞에 +를 붙여주면 숫자로 변환된다.