React 事件处理 about creamidea.github.com

[creamidea]

listenToAllSupportedEvents 会把所有的事件都在 container 上注册一遍！！！

dispatchEventForPluginEventSystem(
  domEventName, // 原生事件名称
  eventSystemFlags, // 事件标志，比如是否 capture
  nativeEvent, // 原生事件对象
  return_targetInst, // null, Suspense, HostRoot。后面也被定义为 ancestorInst
  targetContainer, // 根 DOM 容器
);

onSelect, onChange 这里事件，会由 SelectEventPlugin.js, ChangeEventPlugin.js 内注册处理。原理：会事先通过 registerEvents 函数注册

function registerEvents() {
  registerTwoPhaseEvent('onSelect', [
    'focusout',
    'contextmenu',
    'dragend',
    'focusin',
    'keydown',
    'keyup',
    'mousedown',
    'mouseup',
    'selectionchange',
  ]);
}

在 extract 阶段，会捕获原生 DOM 事件，比如 mousedown，那么进入 switch-case 进行处理，转成查找注册给 React onSelect 事件

function constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget) {
  ...
  const listeners = accumulateTwoPhaseListeners(
    activeElementInst,
    'onSelect',
  );
  ...
}

[creamidea]

https://stackoverflow.com/questions/44279434/react-onselect-event-not-working