# 먼저 vue에서 key이벤트는 아래 블로그를 참조하면 된다.
Vue.js의 이벤트 사용 방법 정리
Vue.js에서 이벤트를 다루는 방법에 대해서 간단히 정리하려고 합니다. HTML에는 나 처럼 당연히 알고 있는 기본 이벤트가 있습니다. 그리고 이미 javascript를 통해서 기본 이벤트와 어우러지게 사용
ux.stories.pe.kr
# 문제는 키 이벤트가 input 태그에서만 실행된다는 점!
<input
type="text"
@keyup.left="key_press('keyleft')"
@keyup.right="key_press('keyright')"
/>키이벤트 정리는 저 위에 블로그를 보면 되고..
암튼 left키를 누르거나 .right 키를 누르면 연결된 이벤트가 실행된다는 점인데
조건이 인풋태그가 활성화 될때만 이라는점..
# 해결방법?
자스에서 dom으로 만지면 된다.
mounted() {
document.addEventListener("keydown", this.key_press);
},키다운 이벤트시 현재 컴포넌트의 key_press함수가 실행된다.
+ 참조 stack overflow
https://stackoverflow.com/questions/68318351/vue-keydown-even-only-firing-when-elements-are-active
vue keydown even only firing when elements are active
I'm running into an odd snag when trying to listen for keydown events in vuejs. I have a keydown event attached to a div tag that encloses my entire visible area: <template> <div class...
stackoverflow.com
'javaScript > vueJs' 카테고리의 다른 글
| css v-bind 사용할때 조심해야할것 (0) | 2023.10.09 |
|---|---|
| vue / bootstrap carousel 자동넘기기 설정. $ref (0) | 2023.03.20 |
| vue / 파일을 수정했지만 캐시땜에 적용안될때? (2) | 2023.03.10 |
| vue / 정적경로 단순화하기 public폴더 웹팩 (0) | 2023.03.10 |
| 이미지 경로 가져오기 & 이미지 경로 바인딩 & 반복문 (2) | 2023.03.10 |