在昨天分享的即時更新中有帶到按鈕的點擊事件綁定,今天來正式說明一下。
本文同步放置於此
綁定事件主要是on修飾詞後面帶事件名稱,例如click
或是keydown
之類的,這邊也可以用|再帶一個變更事件的修飾詞,例如once
這個只會執行事件一次就移除事件的修飾詞。
所以簡單說明如下所示。
on:eventname={handler}
on:eventname|modifiers={handler}
在svelte還可以綁定複數的事件,或者直接在{}
內寫下arrow function如下所示。
<button on:click="{() => count += 1}" on:click="{alert('onClick!')}">
count: {count}
</button>
最後如果當on事件後明沒有賦予值的話是什麼意思呢?那就表示他會把事件轉發給使用他的元件,讓使用他的元件負責處理事件。
今天跟大家分享如何在svelte實作html的綁定,明天準備跟大家分享屬性的綁定。