Skip to content
← Back to rules

react/jsx-key 정확성

작동 방식

배열 내 요소에 key 속성을 강제 적용합니다

왜 문제가 되는가?

React는 배열 내 요소의 변경, 추가, 제거를 식별하는 데 key 속성을 필요로 합니다.

예시

이 규칙에 부적절한 코드 예시:

jsx
[1, 2, 3].map((x) => <App />);
[1, 2, 3]?.map((x) => <BabelEslintApp />);

이 규칙에 적절한 코드 예시:

jsx
[1, 2, 3].map((x) => <App key={x} />);
[1, 2, 3]?.map((x) => <BabelEslintApp key={x} />);

구성

이 규칙은 다음 속성을 가진 구성 객체를 수용합니다:

checkFragmentShorthand

type: boolean

기본값: true

true인 경우, 조각 약어 <> 에서 key 검사를 수행합니다

checkKeyMustBeforeSpread

type: boolean

기본값: true

true인 경우, key 속성이 모든 스프레드 속성 앞에 위치해야 함을 요구합니다

warnOnDuplicates

type: boolean

기본값: true

true인 경우, 중복된 key 값에 대해 경고합니다

사용 방법

구성 파일 또는 명령줄 인터페이스를 통해 이 규칙을 활성화하려면 다음을 사용할 수 있습니다:

json
{
  "plugins": ["react"],
  "rules": {
    "react/jsx-key": "error"
  }
}
bash
oxlint --deny react/jsx-key --react-plugin

참고 자료