diff --git a/libs/horizon/src/event/customEvents/CustomBaseEvent.ts b/libs/horizon/src/event/customEvents/CustomBaseEvent.ts index 8deedd35..3208ff29 100644 --- a/libs/horizon/src/event/customEvents/CustomBaseEvent.ts +++ b/libs/horizon/src/event/customEvents/CustomBaseEvent.ts @@ -6,42 +6,16 @@ import {VNode} from '../../renderer/Types'; // 从原生事件中复制属性到自定义事件中 function extendAttribute(target, source) { - const attributes = [ - // AnimationEvent - 'animationName', 'elapsedTime', 'pseudoElement', - // CompositionEvent、InputEvent - 'data', - // DragEvent - 'dataTransfer', - // FocusEvent - 'relatedTarget', - // KeyboardEvent - 'key', 'keyCode', 'charCode', 'code', 'location', 'ctrlKey', 'shiftKey', - 'altKey', 'metaKey', 'repeat', 'locale', 'getModifierState', 'clipboardData', - // MouseEvent - 'button', 'buttons', 'clientX', 'clientY', 'movementX', 'movementY', - 'pageX', 'pageY', 'screenX', 'screenY', 'currentTarget', - // PointerEvent - 'pointerId', 'width', 'height', 'pressure', 'tangentialPressure', - 'tiltX', 'tiltY', 'twist', 'pointerType', 'isPrimary', - // TouchEvent - 'touches', 'targetTouches', 'changedTouches', - // TransitionEvent - 'propertyName', - // UIEvent - 'view', 'detail', - // WheelEvent - 'deltaX', 'deltaY', 'deltaZ', 'deltaMode', - ]; + let val; + for (let attr in source) { + // 这两个方法需要override + if (attr === 'preventDefault' || attr === 'stopPropagation') { + continue; + } - const length = attributes.length; - let attr; - let type; - for (let i = 0; i < length; i++) { - attr = attributes[i]; - type = source[attr]; - if (type !== 'undefined') { - if (type === 'function') { + val = source[attr]; + if (val !== undefined) { + if (typeof val === 'function') { target[attr] = function() { return source[attr].apply(source, arguments); }; @@ -51,21 +25,40 @@ function extendAttribute(target, source) { } } } + +// 兼容IE的event key +const uniqueKeyMap = new Map([ + ['Esc', 'Escape'], + ['Spacebar', ' '], + ['Left', 'ArrowLeft'], + ['Up', 'ArrowUp'], + ['Right', 'ArrowRight'], + ['Down', 'ArrowDown'], + ['Del', 'Delete'], +]); + export class CustomBaseEvent { - data: string; defaultPrevented: boolean; - customEventName: string; - targetVNode: VNode; - type: string; - nativeEvent: any; target: EventTarget; - timeStamp: number; isDefaultPrevented: () => boolean; isPropagationStopped: () => boolean; currentTarget: EventTarget; relatedTarget: EventTarget; + // custom事件自定义属性 + customEventName: string; + targetVNode: VNode; + type: string; + timeStamp: number; + nativeEvent: any; + + // 键盘事件属性 + key: string; + charCode: number; + keyCode: number; + which: number; + constructor( customEvtName: string | null, nativeEvtName: string, @@ -76,29 +69,25 @@ export class CustomBaseEvent { // 复制原生属性到自定义事件 extendAttribute(this, nativeEvt); - // custom事件自定义属性 - this.customEventName = customEvtName; - this.targetVNode = vNode; - this.type = nativeEvtName; - this.nativeEvent = nativeEvt; - this.target = target; - this.timeStamp = nativeEvt.timeStamp || Date.now(); - const defaultPrevented = nativeEvt.defaultPrevented != null ? nativeEvt.defaultPrevented : nativeEvt.returnValue === false; this.defaultPrevented = defaultPrevented; - this.preventDefault = this.preventDefault.bind(this); this.stopPropagation = this.stopPropagation.bind(this); this.isDefaultPrevented = () => defaultPrevented; this.isPropagationStopped = () => false; this.relatedTarget = nativeEvt.relatedTarget; - } + this.target = target; - // 兼容性方法 - persist() { + // 键盘事件属性 + this.key = uniqueKeyMap.get(nativeEvt.key) || nativeEvt.key; + // custom事件自定义属性 + this.customEventName = customEvtName; + this.targetVNode = vNode; + this.type = nativeEvtName; + this.nativeEvent = nativeEvt; } // 阻止默认行为 diff --git a/libs/horizon/src/event/customEvents/CustomKeyboardEvent.ts b/libs/horizon/src/event/customEvents/CustomKeyboardEvent.ts deleted file mode 100644 index 1ca6ab58..00000000 --- a/libs/horizon/src/event/customEvents/CustomKeyboardEvent.ts +++ /dev/null @@ -1,77 +0,0 @@ -/** - * 自定义键盘事件 - */ - -import type {VNode} from '../../renderer/Types'; -import {CustomBaseEvent} from './CustomBaseEvent'; -import {CHAR_CODE_ENTER} from '../const'; - -const uniqueKeyMap = new Map([ - ['Esc', 'Escape'], - ['Spacebar', ' '], - ['Left', 'ArrowLeft'], - ['Up', 'ArrowUp'], - ['Right', 'ArrowRight'], - ['Down', 'ArrowDown'], - ['Del', 'Delete'], -]); - -const charCodeToKeyMap = new Map([ - [8, 'Backspace'], - [9, 'Tab'], - [13, 'Enter'], - [16, 'Shift'], - [17, 'Control'], - [18, 'Alt'], - [19, 'Pause'], - [27, 'Escape'], - [32, ' '], - [33, 'PageUp'], - [34, 'PageDown'], - [35, 'End'], - [36, 'Home'], - [37, 'ArrowLeft'], - [38, 'ArrowUp'], - [39, 'ArrowRight'], - [40, 'ArrowDown'], - [46, 'Delete'] -]); - -function getKey(event) { - if (event.key) { - return uniqueKeyMap.get(event.key) || event.key; - } - - if (event.type === 'keypress') { - const charCode = event.charCode; - return charCode === CHAR_CODE_ENTER ? 'Enter' : String.fromCharCode(charCode); - } - - if (event.type === 'keydown' || event.type === 'keyup') { - return charCodeToKeyMap.get(event.keyCode); - } - - return ''; -} - -export class CustomKeyboardEvent extends CustomBaseEvent { - - key: string; - charCode: number; - keyCode: number; - which: number; - - constructor( - customEvtName: string | null, - nativeEvtName: string, - nativeEvt: { [propName: string]: any }, - vNode: VNode, - target: null | EventTarget - ) { - super(customEvtName, nativeEvtName, nativeEvt, vNode, target); - this.key = getKey(nativeEvt); - this.charCode = nativeEvtName === 'keypress' ? nativeEvt.charCode : 0; - this.keyCode = (nativeEvtName === 'keydown' || nativeEvtName === 'keyup') ? nativeEvt.keyCode : 0; - this.which = this.charCode || this.keyCode; - } -} diff --git a/libs/horizon/src/event/customEvents/EventFactory.ts b/libs/horizon/src/event/customEvents/EventFactory.ts index 349d7979..59f606ee 100644 --- a/libs/horizon/src/event/customEvents/EventFactory.ts +++ b/libs/horizon/src/event/customEvents/EventFactory.ts @@ -1,16 +1,8 @@ -import {CustomKeyboardEvent} from './CustomKeyboardEvent'; import {CustomBaseEvent} from './CustomBaseEvent'; -const keyboardEvents = { - keypress: CustomKeyboardEvent, - keydown: CustomKeyboardEvent, - keyup: CustomKeyboardEvent, -} - // 创建普通自定义事件对象实例,和原生事件对应 export function createCustomEvent(customEventName, nativeEvtName, nativeEvent, vNode, currentTarget) { - const EventConstructor = keyboardEvents[nativeEvtName] || CustomBaseEvent; - return new EventConstructor( + return new CustomBaseEvent( customEventName, nativeEvtName, nativeEvent, diff --git a/libs/horizon/src/renderer/submit/Submit.ts b/libs/horizon/src/renderer/submit/Submit.ts index 5d359a90..e222564f 100644 --- a/libs/horizon/src/renderer/submit/Submit.ts +++ b/libs/horizon/src/renderer/submit/Submit.ts @@ -13,11 +13,9 @@ import { } from './LifeCycleHandler'; import {tryRenderFromRoot} from '../TreeBuilder'; import { - BySync, InRender, copyExecuteMode, setExecuteMode, - checkMode, changeMode, } from '../ExecuteMode'; import {