svelte 组件中的事件处理

Question

假设我们创建了一个名为 MyAnchor 的自定义元素，它将具有点击事件处理程序并拦截点击，对于某些元素，我们将具有自定义对话框，那么我的问题是，svelte 是否为每个实例分配事件处理程序页面中的那个组件，或者一个委托给所有实例的事件处理程序，传递 ref?问题对任何组件都是通用的。

Answer 1

Svelte 将您的事件处理程序分配给每个实例。

您可以通过查看编译器的输出来了解这一点。（请参阅 https://svelte.dev/repl 中的 "JS output" 选项卡）

例如：

<MyAnchor on:click={handleClick}/>
<MyAnchor on:click={handleClick}/>

将导致：

const myanchor0 = new MyAnchor();
myanchor0.$on("click", handleClick);

const myanchor1 = new MyAnchor();
myanchor1.$on("click", handleClick);

event handling in svelte component