본문 바로가기
개발(라이브러리,프레임워크)/vue.js

spatial-navigation 사용 중 포커스 막기

by zieunee 2022. 9. 22.
반응형

키 제어를 하기 위해 spatial-navigation를 사용하는데
거기 기능에서 pause 하면 포커스가 움직이는 것을 멈춘다.
하지만 리모컨에서는 안먹힘....
그래서 직접 이벤트 리스너를 만들어 이벤트를 막아버렸음


stopFunc(e) {
   e.preventDefault();
   e.stopPropagation();
   return false;
 },
stopKeyEvent() {
      // 키 이벤트 막기
      const all = document.querySelectorAll('*');
      for (const item of all) {
        const el = item;
        if (el.addEventListener) {
          el.addEventListener('keydown', this.stopFunc, true);
          el.addEventListener('keyup', this.stopFunc, true);
        }
      }
    },
    startKeyEvent() {
      // 키 이벤트 정상동작
      const all = document.querySelectorAll('*');
      for (const item of all) {
        const el = item;
        if (el.removeEventListener) {
          el.removeEventListener('keydown', this.stopFunc, true);
          el.removeEventListener('keyup', this.stopFunc, true);
        }
      }
    },

// App.vue에 넣고 이걸 이벤트 바인드 해서 emit으로 원하는 시점에 동작 시키기!! 
반응형