条件分岐¶
条件分岐は"{#if 条件}..{:else if 条件}..{:else}..{/if}"にて条件に応じたレンダリングを行う。
App.svelte¶
<script>
let bind_value = '';
</script>
<div>
<input placeholder="" bind:value={bind_value}>
{#if bind_value.length == 0}
<div>何か入力してください。</div>
{:else if bind_value.length < 5}
<div>もっと入力してください。</div>
{:else}
<div>入力しすぎです。</div>
{/if}
</div>
<style>
</style>
適用イメージ