Svelte form 다루기

<form>
<input type\="text" placeholder\="ID" bind:value\={id} />
<input type\="password" placeholder\="PW" bind:value\={pw} />
<button on:click|preventDefault\={handleSubmit}>로그인</button\>
</form\>

• input에 원하는 값을 바인딩하고, 일반적으로 preventdefault를 사용한다

checkbox는?

  <form>
    <input type="text" placeholder="ID" bind:value={id} />
    <input type="password" placeholder="PW" bind:value={pw} />
    <label>
      <input type="checkbox" bind:group={options} value="auto" />Auto
    </label>
    <label>
      <input type="checkbox" bind:group={options} value="admin" />Admin
    </label>
    <button on:click|preventDefault={handleSubmit}>로그인</button>
  </form>

위와같이 빈 배열에 바인딩해서 사용한다

select 는?

    <select name="country" bind:value={country}>
      <option value="kr">Korea</option>
      <option value="us">Amerca</option>
    </select>

value를 바인딩하면된다