f4e15ff139b9f4e02da2e16d8de32ece0bad2ecad974c1db61926df26ef40a49a090b851fff1bd52a494447cc65e8a4c2b1ded44af3b6b9ee8b0898448fd1b 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. import Utils from '../aria-utils';
  2. import SubMenu from './aria-submenu';
  3. const MenuItem = function(domNode) {
  4. this.domNode = domNode;
  5. this.submenu = null;
  6. this.init();
  7. };
  8. MenuItem.prototype.init = function() {
  9. this.domNode.setAttribute('tabindex', '0');
  10. let menuChild = this.domNode.querySelector('.el-menu');
  11. if (menuChild) {
  12. this.submenu = new SubMenu(this, menuChild);
  13. }
  14. this.addListeners();
  15. };
  16. MenuItem.prototype.addListeners = function() {
  17. const keys = Utils.keys;
  18. this.domNode.addEventListener('keydown', event => {
  19. let prevDef = false;
  20. switch (event.keyCode) {
  21. case keys.down:
  22. Utils.triggerEvent(event.currentTarget, 'mouseenter');
  23. this.submenu && this.submenu.gotoSubIndex(0);
  24. prevDef = true;
  25. break;
  26. case keys.up:
  27. Utils.triggerEvent(event.currentTarget, 'mouseenter');
  28. this.submenu && this.submenu.gotoSubIndex(this.submenu.subMenuItems.length - 1);
  29. prevDef = true;
  30. break;
  31. case keys.tab:
  32. Utils.triggerEvent(event.currentTarget, 'mouseleave');
  33. break;
  34. case keys.enter:
  35. case keys.space:
  36. prevDef = true;
  37. event.currentTarget.click();
  38. break;
  39. }
  40. if (prevDef) {
  41. event.preventDefault();
  42. }
  43. });
  44. };
  45. export default MenuItem;