on*

Solid中的事件处理器通常采用onclick或onClick的形式，具体取决于样式。

<div onClick={(e) => console.log(e.currentTarget)} />

从概念上讲，此示例通过addEventListener将click事件监听器附加到div上。然而，Solid实际上是在文档级别处理常见的可冒泡和可组合的UI事件（如click），然后以合成方式实现委托（捕获和冒泡）。这通过减少事件处理器的数量来提高这些常见事件的性能。

注意，onClick处理的是click事件；通常，事件名称会被映射为小写。如果你需要处理包含大写字母的事件名称，或使用诸如once、passive、capture等监听器选项，请参见on:，它直接附加事件处理器（同时避免通过文档进行复杂的委托）。

Solid还支持向事件处理器传递一个双元素数组，以将值绑定到事件处理器的第一个参数。这不使用bind也不创建额外的闭包，因此是一种高度优化的事件委托方式。

function handler(itemId, e) {
  /*...*/
}

<ul>
  <For each={state.list}>{(item) => <li onClick={[handler, item.id]} />}</For>
</ul>;

事件从不重新绑定，且绑定不具有响应性，因为附加和分离监听器的成本很高。由于事件处理器在每次事件触发时都会像普通函数一样被调用，因此不需要响应性；如有需要可以简化你的处理器。

// 如果已定义则调用，否则不调用
<div onClick={() => props.handleClick?.()} />

注意，onChange和onInput按照它们的原生行为工作（这与React等框架不同）。onInput会在值变更后立即触发；对于大多数<input>字段，onChange只会在字段失去焦点后触发。事件的currentTarget指向事件被附加到的元素，而target给出实际触发事件的元素（例如用户点击的元素）。