Svelte樣板語法

in: 和 out:

in: 和 out: 指令與 transition: 相同，但產生的轉換並非雙向 — 如果區塊在轉換進行時被 outro，則 in 轉換將繼續「播放」，而不是反轉。如果 out 轉換被中止，轉換將從頭重新開始。

<script>
  import { fade, fly } from 'svelte/transition';
  
  let visible = $state(false);
</script>

<label>
  <input type="checkbox" bind:checked={visible}>
  visible
</label>

{#if visible}
	<div in:fly={{ y: 200 }} out:fade>flies in, fades out</div>
{/if}

在 GitHub 上編輯此頁面

transition animate