keyboard-listener.vue 1012 B

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <template>
  2. <view></view>
  3. </template>
  4. <script>
  5. export default {
  6. methods: {
  7. onEvent(event) {
  8. this.$emit(event.type, event)
  9. },
  10. },
  11. }
  12. </script>
  13. <script module="keyboard" lang="renderjs">
  14. export default {
  15. mounted () {
  16. const onKey = (event) => {
  17. const keys1 = ['type', 'timeStamp']
  18. const keys2 = ['altKey', 'code', 'ctrlKey', 'isComposing', 'key', 'location', 'metaKey', 'repeat', 'shiftKey']
  19. const keys3 = ['char', 'charCode', 'keyCode', 'keyIdentifier', 'keyLocation', 'which']
  20. const data = {}
  21. keys1.concat(keys2, keys3).forEach(key => data[key] = event[key])
  22. // console.log("data:",data);
  23. this.$ownerInstance.callMethod('onEvent', data)
  24. }
  25. const names = ['keydown', 'keyup']
  26. names.forEach(name => {
  27. document.addEventListener(name, onKey, false)
  28. })
  29. this.$on('hook:beforeDestroy', () => {
  30. names.forEach(name => {
  31. document.removeEventListener(name, onKey, false)
  32. })
  33. })
  34. }
  35. }
  36. </script>
  37. <style>
  38. </style>