-
[typeScript 오류] li tag : onMouseOver must be accompanied by onFocus for accessibility프론트엔드 개발자가 될거야./ts 2023. 2. 7. 15:39
<li onMouseOver={() => setIsListHover(true)} onMouseOut={() => setIsListHover(false)} >
li tag에 onMouseOver, onMouseOut 이벤트를 추가했더니 eslint typeScript 오류가 났다.
onMouseOver must be accompanied by onFocus for accessibility.
onMouseOut must be accompanied by onBlur for accessibility.
라는데..
를 보고 해결 할 수 있었다.
onMouseOver는 onFocus도 함께 적용시켜줘야하고
onMouseOut는 onBlur도 함께 적용시켜야 한다.
typeScript에서 더욱 더 까다로운 eslint...
- 해결 코드
<li onMouseOver={() => setIsListHover(true)} onFocus={() => setIsListHover(true)} onMouseOut={() => setIsListHover(false)} onBlur={() => setIsListHover(false)} >
'프론트엔드 개발자가 될거야. > ts' 카테고리의 다른 글
[typescript] 너는 무슨 타입이니? (keyof 연산자, Record<string, boolean>) (0) 2023.05.17 [react][react-modal][typeScript] react-modal typeScript 환경에서 style 적용하기 (0) 2023.02.08