Match-id-dc205a4168fcc04ddea513da53c95b9241cd320d
This commit is contained in:
parent
b1458fea04
commit
979ffbdddf
|
@ -21,6 +21,7 @@ import {
|
||||||
getTextareaPropsWithoutValue,
|
getTextareaPropsWithoutValue,
|
||||||
updateTextareaValue,
|
updateTextareaValue,
|
||||||
} from './TextareaValueHandler';
|
} from './TextareaValueHandler';
|
||||||
|
import {getDomTag} from "../utils/Common";
|
||||||
|
|
||||||
// 获取元素除了被代理的值以外的属性
|
// 获取元素除了被代理的值以外的属性
|
||||||
function getPropsWithoutValue(type: string, dom: HorizonDom, properties: IProperty) {
|
function getPropsWithoutValue(type: string, dom: HorizonDom, properties: IProperty) {
|
||||||
|
@ -72,7 +73,8 @@ function updateValue(type: string, dom: HorizonDom, properties: IProperty) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function resetValue(dom: HorizonDom, type: string, properties: IProperty) {
|
function resetValue(dom: HorizonDom, properties: IProperty) {
|
||||||
|
const type = getDomTag(dom);
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case 'input':
|
case 'input':
|
||||||
resetInputValue(<HTMLInputElement>dom, properties);
|
resetInputValue(<HTMLInputElement>dom, properties);
|
||||||
|
|
|
@ -1,6 +1,5 @@
|
||||||
import {getVNodeProps} from '../dom/DOMInternalKeys';
|
import {getVNodeProps} from '../dom/DOMInternalKeys';
|
||||||
import {resetValue} from '../dom/valueHandler';
|
import {resetValue} from '../dom/valueHandler';
|
||||||
import {getDomTag} from '../dom/utils/Common';
|
|
||||||
|
|
||||||
let updateList: Array<any> | null = null;
|
let updateList: Array<any> | null = null;
|
||||||
|
|
||||||
|
@ -8,8 +7,7 @@ let updateList: Array<any> | null = null;
|
||||||
function updateValue(target: Element) {
|
function updateValue(target: Element) {
|
||||||
const props = getVNodeProps(target);
|
const props = getVNodeProps(target);
|
||||||
if (props) {
|
if (props) {
|
||||||
const type = getDomTag(target);
|
resetValue(target, props);
|
||||||
resetValue(target, type, props);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,14 +1,19 @@
|
||||||
/**
|
/**
|
||||||
* 事件绑定实现
|
* 事件绑定实现,分为绑定委托事件和非委托事件
|
||||||
*/
|
*/
|
||||||
import {allDelegatedNativeEvents} from './EventCollection';
|
import {allDelegatedNativeEvents} from './EventCollection';
|
||||||
import {isDocument} from '../dom/utils/Common';
|
import {isDocument} from '../dom/utils/Common';
|
||||||
import {
|
import {
|
||||||
getEventListeners,
|
getEventListeners,
|
||||||
|
getNearestVNode,
|
||||||
getNonDelegatedListenerMap,
|
getNonDelegatedListenerMap,
|
||||||
} from '../dom/DOMInternalKeys';
|
} from '../dom/DOMInternalKeys';
|
||||||
import {createCustomEventListener} from './WrapperListener';
|
|
||||||
import {CustomBaseEvent} from './customEvents/CustomBaseEvent';
|
import {CustomBaseEvent} from './customEvents/CustomBaseEvent';
|
||||||
|
import {runDiscreteUpdates} from '../renderer/TreeBuilder';
|
||||||
|
import {getEventTarget} from './utils';
|
||||||
|
import {isMounted} from '../renderer/vnode/VNodeUtils';
|
||||||
|
import {SuspenseComponent} from '../renderer/vnode/VNodeTags';
|
||||||
|
import {handleEventMain} from './HorizonEventMain';
|
||||||
|
|
||||||
const listeningMarker = '_horizonListening' + Math.random().toString(36).slice(4);
|
const listeningMarker = '_horizonListening' + Math.random().toString(36).slice(4);
|
||||||
|
|
||||||
|
@ -18,6 +23,33 @@ function getListenerSetKey(nativeEvtName: string, isCapture: boolean): string {
|
||||||
return `${nativeEvtName}__${sufix}`;
|
return `${nativeEvtName}__${sufix}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 触发委托事件
|
||||||
|
function triggerDelegatedEvent(
|
||||||
|
nativeEvtName: string,
|
||||||
|
isCapture: boolean,
|
||||||
|
targetDom: EventTarget,
|
||||||
|
nativeEvent, // 事件对象event
|
||||||
|
) {
|
||||||
|
// 执行之前的调度事件
|
||||||
|
runDiscreteUpdates();
|
||||||
|
|
||||||
|
const nativeEventTarget = getEventTarget(nativeEvent);
|
||||||
|
let targetVNode = getNearestVNode(nativeEventTarget);
|
||||||
|
|
||||||
|
if (targetVNode !== null) {
|
||||||
|
if (isMounted(targetVNode)) {
|
||||||
|
if (targetVNode.tag === SuspenseComponent) {
|
||||||
|
targetVNode = null;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// vNode已销毁
|
||||||
|
targetVNode = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
handleEventMain(nativeEvtName, isCapture, nativeEvent, targetVNode, targetDom);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 监听委托事件
|
||||||
function listenToNativeEvent(
|
function listenToNativeEvent(
|
||||||
nativeEvtName: string,
|
nativeEvtName: string,
|
||||||
delegatedElement: Element,
|
delegatedElement: Element,
|
||||||
|
@ -33,7 +65,7 @@ function listenToNativeEvent(
|
||||||
const listenerSetKey = getListenerSetKey(nativeEvtName, isCapture);
|
const listenerSetKey = getListenerSetKey(nativeEvtName, isCapture);
|
||||||
|
|
||||||
if (!listenerSet.has(listenerSetKey)) {
|
if (!listenerSet.has(listenerSetKey)) {
|
||||||
const listener = createCustomEventListener(target, nativeEvtName, isCapture);
|
const listener = triggerDelegatedEvent.bind(null, nativeEvtName, isCapture, target);
|
||||||
target.addEventListener(nativeEvtName, listener, isCapture);
|
target.addEventListener(nativeEvtName, listener, isCapture);
|
||||||
listenerSet.add(listenerSetKey);
|
listenerSet.add(listenerSetKey);
|
||||||
}
|
}
|
||||||
|
|
|
@ -87,7 +87,7 @@ function processListeners(processingEventsList: ProcessingListenerList): void {
|
||||||
|
|
||||||
function getProcessListenersFacade(
|
function getProcessListenersFacade(
|
||||||
nativeEvtName: string,
|
nativeEvtName: string,
|
||||||
vNode: VNode,
|
vNode: VNode | null,
|
||||||
nativeEvent: AnyNativeEvent,
|
nativeEvent: AnyNativeEvent,
|
||||||
target,
|
target,
|
||||||
isCapture: boolean
|
isCapture: boolean
|
||||||
|
@ -147,9 +147,11 @@ function triggerHorizonEvents(
|
||||||
nativeEvtName: string,
|
nativeEvtName: string,
|
||||||
isCapture: boolean,
|
isCapture: boolean,
|
||||||
nativeEvent: AnyNativeEvent,
|
nativeEvent: AnyNativeEvent,
|
||||||
vNode: VNode,
|
vNode: VNode | null,
|
||||||
): void {
|
): void {
|
||||||
const nativeEventTarget = getEventTarget(nativeEvent);
|
const nativeEventTarget = getEventTarget(nativeEvent);
|
||||||
|
|
||||||
|
// 获取委托事件队列
|
||||||
const processingListenerList = getProcessListenersFacade(nativeEvtName, vNode, nativeEvent, nativeEventTarget, isCapture);
|
const processingListenerList = getProcessListenersFacade(nativeEvtName, vNode, nativeEvent, nativeEventTarget, isCapture);
|
||||||
|
|
||||||
// 处理触发的事件队列
|
// 处理触发的事件队列
|
||||||
|
@ -160,6 +162,7 @@ function triggerHorizonEvents(
|
||||||
// 其他事件正在执行中标记
|
// 其他事件正在执行中标记
|
||||||
let isInEventsExecution = false;
|
let isInEventsExecution = false;
|
||||||
|
|
||||||
|
// 处理委托事件入口
|
||||||
export function handleEventMain(
|
export function handleEventMain(
|
||||||
nativeEvtName: string,
|
nativeEvtName: string,
|
||||||
isCapture: boolean,
|
isCapture: boolean,
|
||||||
|
|
|
@ -1,41 +0,0 @@
|
||||||
import {isMounted} from '../renderer/vnode/VNodeUtils';
|
|
||||||
import {SuspenseComponent} from '../renderer/vnode/VNodeTags';
|
|
||||||
import {getNearestVNode} from '../dom/DOMInternalKeys';
|
|
||||||
import {handleEventMain} from './HorizonEventMain';
|
|
||||||
import {runDiscreteUpdates} from '../renderer/Renderer';
|
|
||||||
import {getEventTarget} from './utils';
|
|
||||||
|
|
||||||
// 生成委托事件的监听方法
|
|
||||||
export function createCustomEventListener(
|
|
||||||
target: EventTarget,
|
|
||||||
nativeEvtName: string,
|
|
||||||
isCapture: boolean,
|
|
||||||
): EventListener {
|
|
||||||
return triggerDelegatedEvent.bind(null, nativeEvtName, isCapture, target);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 触发委托事件
|
|
||||||
function triggerDelegatedEvent(
|
|
||||||
nativeEvtName: string,
|
|
||||||
isCapture: boolean,
|
|
||||||
targetDom: EventTarget,
|
|
||||||
nativeEvent, // 事件对象event
|
|
||||||
) {
|
|
||||||
// 执行之前的调度事件
|
|
||||||
runDiscreteUpdates();
|
|
||||||
|
|
||||||
const nativeEventTarget = getEventTarget(nativeEvent);
|
|
||||||
let targetVNode = getNearestVNode(nativeEventTarget);
|
|
||||||
|
|
||||||
if (targetVNode !== null) {
|
|
||||||
if (isMounted(targetVNode)) {
|
|
||||||
if (targetVNode.tag === SuspenseComponent) {
|
|
||||||
targetVNode = null;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
// vNode已销毁
|
|
||||||
targetVNode = null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
handleEventMain(nativeEvtName, isCapture, nativeEvent, targetVNode, targetDom);
|
|
||||||
}
|
|
|
@ -22,7 +22,7 @@ export class CustomBaseEvent {
|
||||||
customEvtName: string | null,
|
customEvtName: string | null,
|
||||||
nativeEvtName: string,
|
nativeEvtName: string,
|
||||||
nativeEvt: { [propName: string]: any },
|
nativeEvt: { [propName: string]: any },
|
||||||
vNode: VNode,
|
vNode: VNode | null,
|
||||||
target: null | EventTarget
|
target: null | EventTarget
|
||||||
) {
|
) {
|
||||||
// 复制原生属性到自定义事件
|
// 复制原生属性到自定义事件
|
||||||
|
|
|
@ -2,14 +2,16 @@
|
||||||
export const ByAsync = 'BY_ASYNC';
|
export const ByAsync = 'BY_ASYNC';
|
||||||
export const BySync = 'BY_SYNC';
|
export const BySync = 'BY_SYNC';
|
||||||
export const InRender = 'IN_RENDER';
|
export const InRender = 'IN_RENDER';
|
||||||
|
export const InEvent = 'IN_EVENT';
|
||||||
|
|
||||||
type RenderMode = typeof ByAsync | typeof BySync | typeof InRender;
|
type RenderMode = typeof ByAsync | typeof BySync | typeof InRender | typeof InEvent;
|
||||||
|
|
||||||
// 当前执行模式标记
|
// 当前执行模式标记
|
||||||
let executeMode = {
|
let executeMode = {
|
||||||
[ByAsync]: false,
|
[ByAsync]: false,
|
||||||
[BySync]: false,
|
[BySync]: false,
|
||||||
[InRender]: false,
|
[InRender]: false,
|
||||||
|
[InEvent]: false,
|
||||||
};
|
};
|
||||||
|
|
||||||
export function changeMode(mode: RenderMode, state = true) {
|
export function changeMode(mode: RenderMode, state = true) {
|
||||||
|
@ -21,7 +23,7 @@ export function checkMode(mode: RenderMode) {
|
||||||
}
|
}
|
||||||
|
|
||||||
export function isExecuting() {
|
export function isExecuting() {
|
||||||
return executeMode[ByAsync] || executeMode[BySync] || executeMode[InRender];
|
return executeMode[ByAsync] || executeMode[BySync] || executeMode[InRender] || executeMode[InEvent];
|
||||||
}
|
}
|
||||||
|
|
||||||
export function copyExecuteMode() {
|
export function copyExecuteMode() {
|
||||||
|
|
|
@ -22,10 +22,11 @@ import { findDomParent, getSiblingVNode } from './vnode/VNodeUtils';
|
||||||
import {
|
import {
|
||||||
ByAsync,
|
ByAsync,
|
||||||
BySync,
|
BySync,
|
||||||
|
InRender,
|
||||||
|
InEvent,
|
||||||
changeMode,
|
changeMode,
|
||||||
checkMode,
|
checkMode,
|
||||||
copyExecuteMode,
|
copyExecuteMode,
|
||||||
InRender,
|
|
||||||
isExecuting,
|
isExecuting,
|
||||||
setExecuteMode
|
setExecuteMode
|
||||||
} from './ExecuteMode';
|
} from './ExecuteMode';
|
||||||
|
@ -329,7 +330,7 @@ export function runDiscreteUpdates() {
|
||||||
|
|
||||||
export function asyncUpdates(fn, ...param) {
|
export function asyncUpdates(fn, ...param) {
|
||||||
const preMode = copyExecuteMode();
|
const preMode = copyExecuteMode();
|
||||||
changeMode(ByAsync, true);
|
changeMode(InEvent, true);
|
||||||
try {
|
try {
|
||||||
return fn(...param);
|
return fn(...param);
|
||||||
} finally {
|
} finally {
|
||||||
|
|
Loading…
Reference in New Issue