Skip to content

Prop'lar ​

Prop, bölümünüzün mağaza sahibinden aldığı ayardır. Panelde tanımlarsınız, form otomatik üretilir, değer bileşeninize aynı adla gelir.

Tanımlama ​

Geliştirme ekranında bölümü seçin → Prop ekle. Her prop şunları taşır:

AlanNe işe yarar
Kod adıBileşende okuyacağınız ad (title). Sonradan değiştirmeyin
TipFormda hangi girdi çizilecek → Prop tipleri
EtiketMağaza sahibinin gördüğü ad ("Başlık")
VarsayılanBölüm eklendiğinde gelen değer
BilgiAlanın altındaki açıklama satırı

Kod adını değiştirmek veriyi kopartır

Mağazaların kaydettiği ayarlar kod adına göre saklanır. title → heading yaptığınızda mağazalarda o alan boşalır ve varsayılana döner.

Adı değiştirmeniz gerekiyorsa yeni prop ekleyip eskisini bir sürüm boyunca yerinde bırakın.

Varsayılan verin ​

Varsayılansız bir prop, bölüm ilk eklendiğinde boş gelir ve mağaza sahibi "bozuk" bir bölüm görür. Metin alanlarına anlamlı bir varsayılan yazmak temanızın ilk izlenimini belirler.

Bileşende kullanma ​

pull sonrası tipiniz hazırdır:

tsx
import type { HeroProps } from '../generated/types';

export default function Hero({ title, subtitle }: HeroProps) {
  return (
    <section>
      <h1>{title}</h1>
      {subtitle && <p>{subtitle}</p>}
    </section>
  );
}

Panelde olmayan bir prop'u okumaya çalışırsanız TypeScript hata verir — form ile bileşenin uyumsuz kalması bu yüzden mümkün değildir.

Veri prop'ları ​

Ürün listesi, Ürün ve Kategori tipleri özeldir: mağaza sahibi bir kaynak seçer (tümü / seçili ürünler / kategori / sayfaya göre), vitrin bunu çözer ve bileşeninize hazır veri gelir. Sorguyu siz yapmazsınız.

Ayrıntı: Veri bağlama.

Sıralama ​

Prop'ları sürükleyerek sıralayabilirsiniz; form aynı sırada çizilir. İlişkili alanları yan yana tutmak mağaza sahibinin işini kolaylaştırır.

Winkwop tema platformu