[warning] React <img> 태그 ESLint 오류

1484 단어 warningReactTILReact

img elements must have an alt prop, either with meaningful text, or an empty string for decorative images. eslintjsx-a11y/alt-text

<img src={location.state.thumbnail} />

리액트에서 이렇게 작성했을때, 위와 같은 에러가 뜬다면

<img src={location.state.thumbnail} alt={location.state.thumbnail} />

이렇게, alt 부분을 추가해주면 된다.

alt속성은 이미지를 보여줄 수 없는 경우, 또는 스크린리더 사용 시 등에 보이는 대체텍스트를 정의해주는 것이다.
ESLint extention에서 웹 접근성을 충족하기 위해 강제 아닌 강제(?)를 시켜주어 알게 된 내용이라 정리한다.

좋은 웹페이지 즐겨찾기