Metin Girdileri için bind:value
Metin girdi değerlerini bileşen değişkenleriyle otomatik olarak eşzamanlı tutun.
Metin Girdileri için bind:value, CoddyKit'te ücretsiz bir Sveltejs Academy dersidir. Bu, 4 dersinin 1. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Sveltejs Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Sveltejs Academy kursu toplamda 4 dersten oluşur.
bind:value Ne Yapar
bind:value yönergesi, bir değişken ile form girdisi arasında iki yönlü bağlantı oluşturur.
Temel Örnek
Bir let değişkenini metin girdisine bağlayın. Yazmak değişkeni günceller; programlı değişiklikler alanı günceller.
<script>
let name = "";
</script>
<input bind:value={name} />
<p>Hello {name}</p>Kısa Yazım
Değişken ile öznitelik aynı adı taşıyorsa sağ tarafı yazmayabilirsiniz.
<input bind:value />Sayı Girdileri
type="number" için Svelte, değeri otomatik olarak sayıya dönüştürür.
<input type="number" bind:value={age} />Aralık Girdileri
Kaydırıcılar da aynı şekilde çalışır ve değerleri sayıya dönüştürür.
<input type="range" bind:value={volume} />Metin Alanları
Metin alanlarında value özniteliğini girdilerde olduğu gibi bağlayın.
<textarea bind:value={comment}></textarea>Tekli Seçim
Tek bir <select> için value değerini seçili seçeneğin değerine bağlayın.
<select bind:value={color}>
<option>red</option>
<option>blue</option>
</select>Programlı Güncelleme
Bağlı değişkene değer atamak girdiyi hemen günceller. Formu temizleyen düğmeler için kullanışlıdır.
function clear() { name = ""; }Yeniden Oluşturma Gerekmez
Tepkisellik otomatiktir. Hiçbir zaman setState çağrısı yapmanız veya yeniden bağlama işlemini elle gerçekleştirmeniz gerekmez.
Doğrulama
Kullanıcı yazarken doğrulama yapmak için tepkisel ifadeler ekleyin.
$: isValid = email.includes("@");Gecikmeli Çalıştırma
Pahalı doğrulamalar için tepkisel bir ifadenin içinde gecikmeli çalıştırma uygulayın veya lodash.debounce gibi bir yardımcı kullanın.
Hızlı Kontrol
bind:value ne yapar?
Özet
Sayı ve aralık girdilerinde otomatik tür dönüştürmeyle iki yönlü girdi bağlama işlemi için bind:value kullanın.
Sıkça Sorulan Sorular
“Metin Girdileri için bind:value” dersi ücretsiz mi?
Evet — “Metin Girdileri için bind:value” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Sveltejs Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Sveltejs Academy kursu toplamda 4 dersten oluşur.
“Metin Girdileri için bind:value” dersinde ne öğreneceğim?
Metin girdi değerlerini bileşen değişkenleriyle otomatik olarak eşzamanlı tutun. Sveltejs Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
Sveltejs Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te Sveltejs Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 1. dersidir.
“Metin Girdileri için bind:value” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu Sveltejs Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her Sveltejs Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- Metin Girdileri için bind:value
- Onay Kutuları için bind:checked
- Radyo ve Onay Kutusu Grupları için bind:group
- DOM Elementi Başvuruları için bind:this