본문 바로가기

분류 전체보기218

spatial-navigation 사용 중 포커스 막기 키 제어를 하기 위해 spatial-navigation를 사용하는데 거기 기능에서 pause 하면 포커스가 움직이는 것을 멈춘다. 하지만 리모컨에서는 안먹힘.... 그래서 직접 이벤트 리스너를 만들어 이벤트를 막아버렸음 stopFunc(e) { e.preventDefault(); e.stopPropagation(); return false; }, stopKeyEvent() { // 키 이벤트 막기 const all = document.querySelectorAll('*'); for (const item of all) { const el = item; if (el.addEventListener) { el.addEventListener('keydown', this.stopFunc.. 2022. 9. 22.
오류 기록 (외부API연동시 options Method 허용 체크) 어어어어어이없었던 실수를 한 경험 외부 API를 연동하는데 postman에서는 잘되는데 웹에 연동을 하면 500Error가 떨어져 버림... headers 값에 'user-token'만 넣고 axios로 보내는 로직이라 아주아주 간단한 거였음 why? 500Error라서 우리 잘못은 아니라 확신을 했는데 연동사에서 계속 우리가 잘못보내고 있는게 아니냐고 의심? ㅎ 해서 나도 열심히 테스트를 진행 했었다. 근데 뭔가 요청 내용이 이상함, user-token값을 넣었는데 보이지도 않고, 내가 알던 요청 헤더 정보가 아녀.. 그래서 로컬로 실행해서 테스트를 해봄, 우리는 셋탑 단말 위에 브라우저를 띄우는 형태라 뭔가 다를 수도 있다고 생각했다. 요청 내용을 보니까 달라요... 왜죠..? CORS가 나긴하지만 .. 2022. 7. 23.
React Transition Group 적용 중 이슈사항 TransitionGroup와 CSSTransition 적용 해보았음 {showingList.map((item: any, index: number) => ( {/* animation 설정 _global.css */} ))} .item-enter-active { opacity: 0 !important; } .item-enter-done { opacity: 1 ; transition: opacity 500ms ease-in; } .item-exit { opacity: 1 !important; } // .item-exit-active { // opacity: 0 !important; // transition: opacity 500ms ease-in; // } // .item-exit-done { // opac.. 2022. 7. 2.
react-query 설치 npm i react-query index.tsx import React from 'react'; import ReactDOM from 'react-dom'; import 'index.css'; import { BrowserRouter } from 'react-router-dom'; import reportWebVitals from 'reportWebVitals'; import { Provider } from 'react-redux'; import { store } from 'store/rootReducer'; import GlobalStyle from 'styles/global-styles'; import { QueryClient, QueryClientProvider } from 'react-qu.. 2022. 6. 12.
반응형