react-multi-date-picker 커스텀 관련 메모

By | 10월 18, 2022
0 Comment

원본 repo https://github.com/shahabyazdi/react-multi-date-picker fork 및 npm 배포환경 설정 참고 fork한 프로젝트 로컬에서 최초 실행 @itpsolver/react-multi-date-picker 프로젝트 루트에서 npm i npm build 위 폴더에서 ‘cd website’ 로 웹사이트 폴더 진입 npm i -g gatsby-cli npm i npm run start 브라우저 http://localhost:8000 진입 소스코드 내 모듈명 replace 본 프로젝트 내에 포함된 website 폴더처럼 해당 라이브러리를 esm import… Read More »

@toast-ui/react-grid (toast grid, tui grid, 토스트그리드) 사용시 data.some is not a function (data.map is not a function)… 등의 에러가 발생했던 경험.

By | 10월 11, 2022
0 Comment

문제상황 toast grid 의 특정 셀을 클릭하여 modal을 띄우는 과정에서 아래와 같은 스크립트 에러 발생 react-dom.development.js:26923 Uncaught TypeError: data.some is not a function at Object.createData (item.js:267:4) at Object.resetData (dropdown.js:314:7) at Grid2.dispatch (utils.js:69:8) at Grid2.resetData (utils.js:69:8) at toastui-react-grid.js:1:4602 at Array.forEach (<anonymous>) at c2.value (toastui-react-grid.js:1:4525) at checkShouldComponentUpdate (react-dom.development.js:14134:33) at updateClassInstance (react-dom.development.js:14698:62) at updateClassComponent (react-dom.development.js:19695:20) 오류메시지의 data가 Grid… Read More »

윈도우 탐색기(내컴퓨터) 가 너무 느릴 때 (폴더를 처음 연 순간 느림, 아니면 정렬 등을 수행할 때 버벅거림)

By | 10월 10, 2022
0 Comment

1. 폴더 최적화 설정 확인 1) 탐색기(내컴퓨터)에서 느린 증상이 있는 폴더 우클릭 > 속성 > ‘사용자 지정’ 탭으로 이동 2) ‘다음에 대해 이 폴더 최적화’ 항목을 ‘일반 항목’으로 변경해 보자. 3) 빨라졌으면 성공, 실패면 다른 방법을…? 설정이 ‘비디오’ 등으로 되어 있으면, 각 파일의 메타정보를 읽어서 처리하는 작업 등에서 시간이 걸린다고 한다.

[React/버튼] button 태그로 만든 버튼이 아닌, div 태그로 a 태그(anchor)를 감싼 형태의 button에 대한 이벤트 바인딩 삽질기

By | 9월 23, 2022
0 Comment

환경 React 18.2.0 Typescript 4.6.3 eslint 8.16.0 common.ts /** * onKeyDown 이벤트핸들러에서 엔터키로 함수 실행하기 */ export const onKeyDownCall = (e: React.KeyboardEvent, func: (ev: React.SyntheticEvent) => void) => { // 'keypress' event misbehaves on mobile so we track 'Enter' key via 'keydown' event if (e.key === 'Enter') { e.preventDefault(); e.stopPropagation(); func(e); } }; test.tsx //… Read More »

[css] 스크롤바(scrollbar) 모양(design, 디자인) 조정하는 샘플코드 (custom…)

By | 9월 16, 2022
0 Comment

/* * 스크롤바 디자인 커스텀하는 코드 * * – 일단 antd table 내의 스크롤바를 가공해 보았음 * – webkit 계열에서만 사용할 수 있다고 함. */ /* 스크롤바 폭 */ .ant-table-body::-webkit-scrollbar { width: 8px; /* 여기서 height가 의미가 있나? */ } /* 스크롤바에서 움직이는 부분 */ .ant-table-body::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 2px; background-color: #bbb;… Read More »

[Mapbox] cluster 클릭시 zoom이 되지 않던 현상

By | 8월 12, 2022
0 Comment

cluster 기능을 사용하면서, map.getSource([source name]).getClusterExpansionZoom() 함수 호출시 결과로 리턴되는 zoom의 숫자가 증가되지 않아, 결과적으로 줌이 되지 않는 문제가 발생한 적이 있다. 정확한 원인은 알 수 없으나, mapbox studio 로 자작한 맵이 문제인 것으로 판단된다. 커스텀 맵이 아닌 기본형 맵을 사용하니 zoom 숫자가 정상적으로 증가되었다. 이래서 솔루션 삽질은 늘 알 수 없는 변수가 있다니까..

[링크] React Render Props 패턴 관련

By | 7월 29, 2022
0 Comment

메모 hooks가 render props를 대부분 대체하지만, 그래도 render props가 필요한 경우가 있다… 라는 류의 글들이 심심찮게 보임 참고 Render Props vs React Hooks: Which Is More Efficient?