@willis.streich
В Svelte директивы используются для добавления специальных атрибутов к элементам, которые позволяют вам контролировать их поведение.
Директивы начинаются с символа :
перед атрибутом. Например, чтобы связать значение элемента с переменной, вы можете использовать директиву bind:value
:
1
|
<input type="text" bind:value={myValue}> |
Эта директива bind:value
означает, что значение элемента будет связано с переменной myValue
. Теперь, когда пользователь вводит текст в поле ввода, значение переменной myValue
автоматически обновляется.
Другие примеры директив в Svelte:
1
|
<button on:click={handleClick}>Click me</button> |
1 2 3 |
{#if showElement} <p>This element is shown when showElement is true</p> {/if} |
1 2 3 |
{#each items as item} <li>{item}</li> {/each} |
Эти директивы представляют лишь небольшую часть того, что можно сделать с Svelte. Svelte предоставляет множество директив, которые помогают вам создавать динамические и интерактивные веб-приложения.