← Back to rules

react/jsx-handler-names 스타일

작동 방식

이벤트를 처리하는 데 사용되는 컴포넌트 또는 프로퍼티 메서드가 올바르게 접두사로 시작하는지 확인합니다.

왜 문제가 될까?

이벤트 핸들러 및 프로퍼티의 이름이 일관되지 않으면 코드의 가독성과 유지보수성이 낮아집니다.

예시

이 규칙에 잘못된 예시:

<MyComponent handleChange={this.handleChange} />
<MyComponent onChange={this.componentChanged} />

이 규칙에 올바른 예시:

<MyComponent onChange={this.handleChange} />
<MyComponent onChange={this.props.onFoo} />

구성

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

checkInlineFunctions

type: boolean

기본값: false

JSX 속성 내에 인라인 함수가 있는지 검사할지 여부.

checkLocalVariables

type: boolean

기본값: false

JSX 속성 내에 지역 변수가 있는지 검사할지 여부.

eventHandlerPrefixes

type: string

기본값: "handle"

검사 대상이 되는 이벤트 핸들러 접두사입니다.

eventHandlerPropPrefixes

type: string

기본값: "on"

검사 대상이 되는 이벤트 핸들러 프로퍼티 접두사입니다.

eventHandlerPropRegex

type: string

이벤트 핸들러 프로퍼티 접두사를 위한 컴파일된 정규 표현식.

eventHandlerRegex

type: string

이벤트 핸들러 접두사를 위한 컴파일된 정규 표현식.

ignoreComponentNames

type: string[]

기본값: []

이벤트 핸들러 접두사 검사에서 무시할 컴포넌트 이름 목록입니다.

사용 방법

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

구성 파일 (.oxlintrc.json)

{
  "plugins": ["react"],
  "rules": {
    "react/jsx-handler-names": "error"
  }
}

CLI

oxlint --deny react/jsx-handler-names --react-plugin

참고 자료

• 규칙 소스