본문 바로가기
React

[React] <a> 태그 사용시 오류 해결

by 홍두두현 2023. 1. 16.
반응형
Router test 롤백 6번 ^^...

오류 발생

The href attribute requires a valid value to be accessible~~~라는 오류가 나왔다

Router를 공부하던 도중 그래도 꽤 많은 오류를 만났다고 생각했는데 아직도 빨간 글씨는 마주치면 어색하다. 피하진 말아야지.

본론으로 들어가서 이 오류가 무엇을 뜻하는가?
영어의 중요성

프런트 개발을 하다 보면 많이 작성하게 된다.
a태그의 attribute인 href=""또한 같이 만나게 된다. React를 사용하지 않았을 때 작성했던 코드처럼 똑같이 작성했다.

<a href="#">
<a href="javascript:;">
<a href="javascript:void(0)">

하지만 여기서 오류를 맞이하게 되었다.

The href attribute requires a valid value to be accessible.
Provide a valid, navigable address as the href value. 
If you cannot provide a valid href, but still need 
the element to resemble a link, use a button and change 
it with appropriate styles. Learn more: https://github.com/
jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/anchor-is-valid.md 

뭐 이런 내용의 오류였다.

다 해석하기엔 조금 힘들어서 일부 번역만 해봤을 때 a태그 사용 시href=""에 유효한 값을 안 넣어줘서 나오는 오류였다.

해결 방법

<a href="#!">해결 방법 1</a>
  
<a href="{()=>false}">해결 방법 2</a>

이렇게 적어주면 오류 말끔히 해결된다.

반응형

'React' 카테고리의 다른 글

[React] React Router  (0) 2023.01.17
[React] SPA 란?  (0) 2023.01.16
[React] LifeCycle API  (0) 2023.01.16
[React] state  (0) 2023.01.16
[React] props  (0) 2023.01.16

댓글