반응형 Web Front 개발공부60 Uncaught TypeError: Cannot read properties of undefined (reading 'map') 배열 렌더링 오류 jsonplaceholder.typicode.com/todos 를 호출해서todo 데이터를 리액트 쿼리를 이용 간단한 조회 화면 하나 만들려 하는데 에러가 난다. 유투브를 보며 코딩을 따라하는 와중... 난 에러가 나는데... 원인은 리액트의 렌더링 방식에 있다.화면은 모두 렌더링을 했는테 그 시점에 그릴 수 있는 data가 없는 경우다. 자주 만나는 발생 원인이다. 리액트의 렌더링 및 데이터의 페치의 타이밍 이해가 필요하다.해결 방법 return ( ul> {data.map((item: todo) => ( li key={item.id}>{item.title}li> ))} ul> ); 기존 방식에서 data가 없다면 이라는 .. 2025. 12. 16. 리액트 타입스크립트 vs경고 : Parameter 'item' implicitly has an 'any' type. Parameter 'item' implicitly has an 'any' type.요런 경고가 발생. data.map 의 인수 item의 타입이 몬지 모르기 때문에 타입을 지정해주는 방식으로 코딩을 해준다. 인터페이스를 상단에 추가해주고 interface todo { userId: string; id: number; title: string; completed: boolean;} 해당 하는 타입을 지정해주면 경고는 사라진다.생각해보면 타입스크립트를 사용하는 코딩에서는 당연한 경고. 2025. 12. 16. React TS useCallback useCallback 사용 전,import React, { useEffect, useState } from 'react';/*20250919* useCallback 함수를 메모이제이션 하는 기능 자바스크립트에서 함수도 변수에 저장이 된. 변수도, 함수도 사실 메모리에 올리는 것이니 특정 함수를 const 하면 어쨌건 다시 리로딩하니까.... 함수를 특정 변수의 의존적 메모제이션으로 만들어 사용한다. 리액트가 모바일에서 부터 출발했으니 리소스 관리가 디테일한 건 아주 당연한듯** ===> onChange={ (e) => setNumber(e.target.value)} //형변환 경고가 뜬다. input 박스의 이벤트 함수가 string을 받기 때문이다*/const Edu_usecallbac.. 2025. 9. 19. 리액트 훅 정의 * 리액트 훅 정의용도훅데이터 컴포넌트 관리useMemouseCallbackuseStateuseReducer컴포넌트 생명 주기useEffectuseLayoutEffect컴포넌트 메서드 호출useRefuseImperativeHandler컴포넌트 정보 공유useContext 2024. 11. 9. 리액트 타입스크립트 props 리액트 타입스크립트 props 리액트 + 타입스크립트 프로젝트에서 props를 사용하는 방법 타입과 인터페이스를 매개변수로 사용할 수 있는데 관련 기록 1. props를 3가지 타입을 받는 PropsTest라는 컴포넌트를 작성.import React from 'react';type paramType = { year: number, dept:string, imType:string}//props가 타입(인터페이스도 존재)일 경우..const PropsTest = ({year,dept,imType}:paramType) => { return ( 년도 : {year} 부서: {dept} 종류: {imType} .. 2024. 8. 28. VSCODE github 연동설정 VSCODE github 연동설정 vscode를 설치 한 후, github에 만든 소스를 손쉽게 업로드하는 방법을 알아보도록 한다. 상당히 간단하다. git과 github는 서로 다른 기능의 소프트웨어란 것을 기억하길 바라고. 우선 git을 내 로컬 컴퓨터에 설치 해야 한다. 이후 github 사이트에 들어가 계정을 만들고 vscode로 연동 한다. 1. git을 로컬 컴퓨터에 설치한다. (윈도우로 예시)https://git-scm.com/download/win Git - Downloading PackageDownload for Windows Click here to download the latest (2.46.0) 32-bit version of Git for Windows. This is the .. 2024. 8. 4. 이전 1 2 3 4 ··· 10 다음 반응형
