Skip to content

Commit 3d25672

Browse files
docs: Add spread guidance for multiple event handlers (#13240)
* Update 04-event-handlers.md Added documentation on managing multiple event handlers and spreading props. * Update 04-event-handlers.md Used spread variable rather than implying there was a props variable from $props above. * tweak --------- Co-authored-by: Rich Harris <[email protected]>
1 parent 3c97c0a commit 3d25672

File tree

1 file changed

+14
-0
lines changed

1 file changed

+14
-0
lines changed

sites/svelte-5-preview/src/routes/docs/content/01-api/04-event-handlers.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -178,6 +178,20 @@ Duplicate attributes/properties on elements — which now includes event handler
178178
</button>
179179
```
180180

181+
When spreading props, local event handlers must go _after_ the spread, or they risk being overwritten:
182+
183+
```svelte
184+
<button
185+
{...props}
186+
onclick={(e) => {
187+
doStuff(e);
188+
props.onclick?.(e);
189+
}}
190+
>
191+
...
192+
</button>
193+
```
194+
181195
## Why the change?
182196

183197
By deprecating `createEventDispatcher` and the `on:` directive in favour of callback props and normal element properties, we:

0 commit comments

Comments
 (0)