웹프로그래밍/React (5) 썸네일형 리스트형 [React.js] React Router v5, useRouteMatch 추가. https://github.com/ReactTraining/react-router/releases/tag/v5.1.0 Release v5.1.0 · ReactTraining/react-router Read the blog post List of commits Features Add useParams, useLocation, useHistory, and useRouteMatch hooks (d6224d6) Add support for forwardRef in (b5528ed) Add support for functions in { const { params }: any = useRouteMatch(); // /path/:idx return ( {params?.idx} ); }; export default .. [React.js] Object is possibly 'null' input 에 focus 를 주기 위해, ref 설정을 하고 focus 를 주었는데, "Object is possibly 'null'" 오류가 계속 발생한다. if 조건문으로 한번 감싸 주었는데도.. 그래서 아래와 같이 tsconfig.json 을 수정해주었다. // tsconfig.json { ... "strictNullChecks": false, ... } [React.js] unmounted component memory leak React.js 에서 비동기 요청 등의 동작 이후 응답/set state 가 되기 전에 해당 컴포넌트가 unmount 되면서 set state 오류가 나는 경우가 있다. 그럴때는 아래와 같이 해주면 된다. const mounted = useRef(false); useEffect(() => { mounted.current = true; () => { mounted.current = false; } }, []); const fetch = async () => { const res = await fetch(); if (!mounted.current) { return; } // now mounted. do something else }; [React] React Hook 에서 array state 업데이트시 리렌더링 되지 않을때 array state 의 index 개수 변동이 없을때에는 re-render가 일어나지 않는다. 이럴때에는 새로운 array 로 set state를 해주면 된다. const arr = [1, 2, 3]; setArray([...arr]); [React] Component Link to 로 연결시 스크롤 문제 해결 Component 를 Link to 로 연결시에 스크롤이 0 으로 이동되도록 아래와 같이 처리 이전 1 다음
