@keyup 이벤트에 의해 이 메서드가 트리거되지 않는 이유는 무엇입니까?

@keyup 이벤트에 의해 이 메서드가 트리거되지 않는 이유는 무엇입니까?

텍스트 필드를 (Electron-Vue 앱에서) + 바로 가기에 초점을 맞추려고 합니다.

---

코드: https://codepen.io/anon/pen/aqrBzq?editors=1010

고문서는 이것을 사용한다. v-text-field커스텀 컴포넌트와 Github에 대한 이 코멘트처럼 메서드는 다음과 같이 랩해야 합니다.$nextTick이 컴포넌트의 초점을 맞추기 위해

---

이것이 필요하지만 작동하지 않는다.

 <v-text-field
   ref="filter"
   @keyup.alt.67="focusFilter" 
   label="type here" >
 </v-text-field>

 ...

 methods: {
   focusFilter(event){
     this.$nextTick(event.target.focus)
   }
 }

이것은 동작하지만, 필요한 것은 아닙니다.

아래 코드도 버튼에 포커스를 맞추려고 했는데, 키숏컷으로 동작하고 싶습니다(예를 들어 +, 보다 바람직한 것은 +, 그러나 예를 들어 예약된 숏컷은 사용하지 않습니다).

 <v-btn @click="focusFilter()">focus</v-btn>

 ...

 methods: {
   focusFilter(event){
     this.$nextTick(this.$refs.filter.focus)
   }
 }

컴포넌트에서 네이티브이벤트를 리슨할 때는.native수식어

대신 이것을 사용하세요.

@keyup.native.alt.67="focusFilter"

자세한 내용은 이쪽:https://vuejs.org/v2/guide/components.html#Binding-Native-Events-to-Components

---

이 입력에 초점을 맞추려면alt+c를 누르면 이벤트 핸들러를 추가할 필요가 있는 모든 포커스가 설정됩니다.window위해서keyup.

다음과 같은 적절한 상황에서 초점을 맞추는 방법을 개발했습니다.

methods: {
  listenForFocusFilterShortcut (event) {
    if (event.keyCode === 67 && event.altKey) {
      this.$refs.filter.focus()
    }
  },
}

그런 다음 생성된 후크를 추가하고 이 콜백을 창에 연결합니다.keyup이벤트입니다.

created () {
  window.addEventListener(
    'keyup',
    this.listenForFocusFilterShortcut
  )
},

그런 다음 컴포넌트가 삭제되면 이벤트청취자를 삭제합니다.

destroyed () {
  window.removeEventListener(
    'keyup',
    this.listenForFocusFilterShortcut
  )
}

언급URL : https://stackoverflow.com/questions/49101182/why-isnt-this-method-getting-triggered-by-a-keyup-event