Svelte 事件修飾符

DOM 事件處理程序具有額外的 修飾符（modifiers） 。例如，帶 ?once? 修飾符的事件處理程序只運用一次：

<script>
	function handleClick() {
		alert('no more alerts')
	}
</script>

<button on:click|once={handleClick}>
	Click me
</button>

所有修飾符列表：

• preventDefault ：調(diào)用event.preventDefault() ，在運行處理程序之前調(diào)用。比如，對客戶端表單處理有用。
• stopPropagation ：調(diào)用 event.stopPropagation(), 防止事件影響到下一個元素。
• passive ： 優(yōu)化了對 touch/wheel 事件的滾動表現(xiàn)(Svelte 會在合適的地方自動添加滾動條)。
• capture — 在 capture 階段而不是bubbling 階段觸發(fā)事件處理程序 (MDN docs)
• once ：運行一次事件處理程序后將其刪除。
• self — 僅當(dāng) event.target 是其本身時才執(zhí)行。

你可以將修飾符組合在一起使用，例如：on:click|once|capture={...}。