킹바구니 🦜

아니 오 ㅐ안대는거임? pc에서는 잘만 되는데 모바일로 가니까 드래그 자체는 되는데 따로 걸어둔 click이벤트들이 죄다 안먹혀서 열심히 고민하다가 찾아냄 1. touchend로 또 걸어주기이동별도로 이래이래 걸면 먹힌다. 왜 onTouchStart가 아니냐면... 잊었다 아무튼 start로 했더니 너무 민감해서 찾아보다가 end로 걸었는데 잘 되었기때문에 적어둠.https://ui.toast.com/posts/ko_20220106 터치와 클릭, 우리 깐부잖아.터치와 클릭을 사용하지 않는 하루를 상상해보자. 과연 어떨까? 필자는 두 동작 없는 하루를 이제는 상상할 수 없다. 사용자일 때는 무의식적으로 사용해서 이 두 동작의 관계에 대해 깊게 생각ui.toast.com이건거같기도   번외1. input창 ..

보통 설정에서 공통으로 잡을텐데 프로젝트별로 구조가 달라서 별도로 설정해줘야할때는 이렇게 하면 된다. 1. 루트 폴더에 .vscode 폴더 생성 프로젝트 열었을 때 제일 상위에 만들어주라는 의미. 앞에 온점 빼먹지 말고 넣어줘야함. 나같은 경우 이렇게 만들어주었음. 2. 그 안에 settings.json 파일 생성 { "liveSassCompile.settings.generateMap": false, "liveSassCompile.settings.formats": [ { "format": "expanded", "extensionName": ".css", "savePath": "~/../" } ], } 그리고 원하는 설정을 넣어주면 된다.

iframe을 가지고 있는 페이지였는데 확대축소 기능을 넣어서 마우스로 끌어서 이동하는 기능을 넣었어야했음. 그때 가끔 간헐적으로 위에 짤처럼 화면이 긁히는 현상이 일어나서 어케 해결하지 하다가 발견함. 1. css 추가 .unselectable { -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } 난 pointer-events: none 넣으면 되는줄 알고 이것만 줄창 해놓고 왜 안대제 하고 있었징~

setTimeout에서 뭔가 리턴하는데 그거 자체를 promise로 처리하고 싶다면 이렇게 쓰면 된다. 1. setTimeout 자체를 promise로 감싸기 return new Promise((res, rej) => setTimeout(async() => { return await this.something(); }, 6000)); 이로케~

리엑트에서 배열인 변수를 set함수를 통해 변경하려고 하는데 자꾸 이런 멘트가 떴음. 1. 초기값 셋팅해주기 반복기가 없다는 의민데 혹시 초기값이 undefined나 빈값인건가 체크해서 변경해주면 된다. const [arr, setArr] = useState(); // 이 부분에서 useState([]) 이렇게 변경해주기 setArr((prev) => ([...prev, {title: "제목", text: "내용"}]));

1. React를 import 해주기 import React, { createContext, useState } from "react"; 앞에 import React 부분을 넣어주면 된다.

타스에서 뭔가 작업하다보면 this에 위와 같은 에러가 뜸. 빠른 수정에는 화살표 함수를 쓰면 된다는데 그래도 에러는 사라지지 않는다. 이럴때 해결하는 방법! 1. tsconfig 수정 { "noImplicitThis": false } compilerOptions안에 있는 noImplicitThis를 false로 바꿔주면 된다. 아니면 this에 타입을 any말고 정확하게 짚어주면 됨.

이상하게 검색할때 간헐적으로 뭔가 이상하게 돌아가는거 같아서 증상 재현을 위해 수십번 해보고, 내부 돌아가는 코어에 뭔가 문제가 있나 뒤지다가 인제보니 헐 무려 이벤트가 두번 들어가서 그랬던거시다... 처음에는 keydown keyup문젠가 싶었다가 또 무슨 리엑트 문젠가 싶다가 머야머야 하면서 event.prevent뭐시기도 해보고, 디바운스도 해보고, 찾다보니 또 한글일때 영어일때 이런 경우가 많이 나오더라 근데 난 이경우가 아닌데.. 하다가 발견함. 1. 막아주기 if (e.code == "Enter" && e.key == "Enter") { search(); } event에서 keycode가 13, 229번일때 code가 둘다 "Enter"라서 그랬던 것임. 대신 서로 key값이 서로 달라서(아마..

왜~~~~~~~~~~~라고 하신다면 아래와 같이 수정 필요 1. 타입 따로 설정해주기 wrapper.querySelectorAll(".a").forEach((a: HTMLElement) => a.style.top = "10px"); 다른거는 잘만 추론하면서 이거는 또 HTMLElement라고 안써주면 에러를 뱉으신다.

한번 혼자 처음부터 다 해보려는데 뭔소리고~~~~~~~~~~~~~~~~~~~~ 맨날 남이 기본 셋팅 해준걸로 시작하다보니 config파일이고 뭐고 다 어렵다 어려워 1. vite.config.ts 수정 import path from 'path'; export default defineConfig({ plugins: [react()], resolve: { alias: { '@': path.resolve(__dirname, 'src'), }, }, }) import path를 추가하고, resolve부분을 복붙해주면 된다. 참고로 import 부분에 에러가 난다면 마우스 대고 빠른 수정 눌러서 type node를 추가(설치)하거나 npm install --save @types/node 이걸 해주면 될듯. 2..