javascript / beginner
Snippet
Basic Event Handling
In Svelte, you use the 'on:' directive to listen to DOM events. This is the standard way to handle user interactions like clicks, mouse movements, or keyboard input within your components.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
<script>let count = 0;function handleClick() {count += 1;}</script><button on:click={handleClick}>Clicks: {count}</button>
svelte
Breakdown
1
on:click={handleClick}
Attaches a click event listener that triggers the handleClick function.
2
count += 1;
Updating a local variable automatically triggers a UI refresh in Svelte.