React key 오류 Warning: Each child in a list should have a unique "key" prop.key값 설정은 최상위 태그에서 이뤄져야 하는데 아래와 같이 잘못 설정하여 오류가 발생했다. key오류가 발생시 확인해야할 것들 with GPT 1. 리스트 요소의 key 중복문제: key 속성이 중복되거나 고유하지 않아서 문제가 발생할 수 있습니다. 이 경우, key 속성이 설정된 모든 요소가 서로 다른 값을 가져야 합니다. 2. 리스트가 중첩된 경우 => import된 컴포넌트에 key값이 설정되어 있는지 확인문제: 중첩된 리스트에서 key를 설정하지 않거나, key가 중복될 때 문제가 발생할 수 있습니다. 특히, 리스트를 생성하는 컴포넌트가 key를 제대로 설..
map함수 내에서 중괄호를 사용하면 그 안의 코드는 블록스코프를 가지는 코드블록으로 간주됩니다.즉, 함수의 본문으로 해석되기 떄문에 명시적으로 return을 사용해야 합니다.{someArray.map((ele:{ a:string; b:string; c:string; })) => { return( {ele.b} {ele.c} )}}; map함수 내에서 JSX를 반환할 때 소괄호를 사용하면 암시적 반환을 하여 표현식을 바로 반환합니다.{someArray.map((ele:{ a:string; b:string; c:string; })) => ( {ele.b} {ele.c} ))}; 암시적 반환 명시적 반환이란? 명시적반환과, 임시적 반환은 자바스..
경로 설정방법1. public- process.env.PUBLIC_URL2. src-import-requrie('경로').default 참고사이트https://bokjiho.medium.com/react-%EB%A6%AC%EC%95%A1%ED%8A%B8%EC%97%90%EC%84%9C-%EC%9D%B4%EB%AF%B8%EC%A7%80-%EA%B2%BD%EB%A1%9C-%EC%84%A4%EC%A0%95%ED%95%98%EA%B8%B0-public-src-%EB%94%94%EB%A0%89%ED%86%A0%EB%A6%AC-%EC%B0%A8%EC%9D%B4-fddb4f455c2a [React] 리액트에서 이미지 경로 설정하기 (public, src 디렉토리 차이)public 디렉토리 VS. src 디렉토리bok..
Module parse failed: Unexpected character '@' (1:0) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders > @tailwind base; | @tailwind components; | @tailwind utilities; postcss-loadercss-loaderstyle-loader 셋 다 설치했는데 도대체 왜 안되는 것이냐... 진도가 안나가잖아...
내가 처음에 작성한 코드 sortItem = () => { this.setState({ flag : !this.state.flag, serverData : this.state.serverData.sort((a,b)=> {return this.state.flag ? a.price-b.price : b.price-a.price} ) }) } GPT가 알려준 잘못된 점 주어진 코드에서 this.state.serverData.sort() 메서드를 호출하면, 원본 배열인 this.state.serverData를 직접 변경하는 것입니다. 그리고 이 변경된 배열을 다시 setState 메서드로 설정하여 상태를 업데이트합니다. 그러나 React에서는 상태(state)를 업데이트할 때 직접 원본 데이터를 수정하는 것은 ..
- Total
- Today
- Yesterday
- 배열내특정요소찾기
- .finally()
- 객체리터럴
- 대괄호표기법
- 머리아프다..
- null과 undefined
- 비동기
- 전역변수
- .then()
- 함수형코딩
- 에이블스쿨2일차
- 미들웨어위치
- 문자열
- JSX
- 동등비교연산자
- 태스크큐
- promise
- 상속
- 리액트 이미지경로
- 함수
- unique "key" prop.
- 프로토타입 체이닝
- 조대곤교수님
- .catch()
- unexpected character
- react
- universal rendering
- Props
- cors위치
- 객체속성 추가 삭제
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |