{{ name }}

{{ job }}

{{ age }}

---

Şapka Var mı?: {{ giyim.sapka }}

Pantolon Tipi: {{ giyim.pantolon }}

T-Shirt Var mı?: {{ giyim.tshirt }}

---

Özellik 1: {{ yetenek[0] }}

Özellik 2: {{ yetenek[1] }}

---

Gün Durumu: {{ hesapla("Elif", "geceler") }}

Toplama: {{ topla() }}

---

Website: Benim Sitem

Website: v-bind : ile belirtildi - Benim Sitem

---

Etkinlikler (Events)

Yaşım: {{ age }}

Yaşımı Azalt Yaşımı Artır

Yaşımı Fonksiyon ile Azalt Yaşımı Fonksiyon ile Artır

Yaşımı 10 Azalt Yaşımı 10 Artır

---

Olay Düzenleyiciler (Events Modifiers)

Detaylar için: https://vuejs.org/guide/essentials/event-handling.html#event-modifiers

Yaşım: {{ age }}

Yaşımı Azalt (.once ile sadece 1 kere çalışırı) Yaşımı Artır (.once ile sadece 1 kere çalışırı)

Prevent ile sadece fonksiyonu çalıştırıyor ama sayfaya gitmiyor.

---

Klavye Etkinlikleri

Detaylar için: https://vuejs.org/guide/essentials/event-handling.html#key-modifiers

Birşey yazıp "enter" tuşuna basarsan konsolda bilgi verir:
Birşey yazıp "option(alt) + enter" tuşuna basarsan konsolda bilgi verir:

---

Çift Yönde Veri İşleme

İsim:
Yaş:

İsim: {{ isim }}
Yaş: {{ yas }}

---

İşlenmiş Özellikler - Computed Properties

A'ya 1 Ekle B'ye 1 Ekle

A: {{ a }}

B: {{ b }}

Yaş + A = {{ aYaEkle }}

Yaş + B = {{ bYeEkle }}

---

Dinamik CSS

Ekstra'yı Değiştir Aktifliği Değiştir

---

Şart İşlemler

Hata Toggle'ı Başarılı işlem Toggle'ı

İşlem Hata Verdi

İşlem Başarılı

Aşağıdaki mesajı (display:none) ile gizle

Yazıyı göster veya gizle (display:none ile)

---

Döngü İşlemleri

• {{ karakter }}

• {{ ozellik.name }} - {{ ozellik.age }}

• {{ index }} - {{ ozellik.name }} - {{ ozellik.age }}

---

Çoklu Vue Instance'ları

---

Bileşen İşlemleri - Components