本文共 2597 字，大约阅读时间需要 8 分钟。

���������������������������������������������������������������������

��� Vue.js ������������������������������������������������������������������������������������������ DOM ������������������������������������������������������������������������������

��������������������������� Vue ������

��������������������� Vue ��������������������������������������������������������������������������������� keyDirective.js���

���������������

import Vue from 'vue'
Vue.directive('keyBindListen', {
  bind: function(el, binding) {
    document.onkeydown = function(e) {
      var ev = e ? e : window.event
      var curkey = ev.keyCode || ev.which
      curkey = keyMapping(curkey)
      
      if (curkey) {
        var key = keyMapping(curkey)
        // ������������ bind_key ���������������������
        $('[bind_key]').each(function() {
          if (key === $(this).attr('bind_key')) {
            // ��������������������� DOM ������
            var id = $(this).attr('id')
            $('#' + id).focus().click()
          }
        })
      }
    }
  }
})
// ��������������� keyMapping ������������������������������������������
function keyMapping(keycode) {
  var key = ''
  switch (keycode) {
    case 27:
      key = 'ESC'
      break;
    case 33:
      key = 'PAGEUP'
      break;
    case 34:
      key = 'PAGEDOWN'
      break;
    // ���������������������������������������������
    default:
      key = String.fromCharCode(keycode)
  }
  return key
}

��������������������������������������������� ��� Vue ���������������������������������������������������������������������������������������������������

  
   
    
    
    
    ������������������
  
   
  

��������������������������������� ��� keyMapping ���������������������������������������������������������������������������������������

function keyMapping(keycode) {
  let key = ''
  switch (keycode) {
    case 27:
      key = 'ESC'
      break;
    case 33:
      key = 'PAGEUP'
      break;
    // ������������������������
    default:
      key = String.fromCharCode(keycode)
  }
  return key
}

���������������������

• bind_key ��������������������������������������� bind_key ���������������������������

• keyMapping ���������������������������������������������������������������������������������������������������������������

������������������������������������������������ v-key-bind-listen ������������������������������������ bind_key ��������������������������������������������� DOM ������������������

������������������������������������������������������������������������������������������������������������������������