思考

vue render 中可以通过 onXXX去注册一些事件，例如 onClick(){}，去注册点击事件

实现

export function processElement(vnode, container) {
  // other code
  
  // 设置行内属性
  for (const key in props) {
    const val = props[key];
    /** 注册事件
     * 1. 判断是否on开头并包含一个大写字母开头
     * 2. 是的话，截取on后面的内容
     * 3. 注册元素事件
     */
    if (isEvents(key)) {
      el.addEventListener(isEvents(key), val);
    } else {
      el.setAttribute(key, val);
    }
  }
  
  // other code
}

function isEvents(key: string = "") {
  const reg = /^on[A-Z]/;
  if (reg.test(key)) {
    // onClick -> click
    return key.slice(2).toLocaleLowerCase();
  }
  return "";
}