Adım 9: Bileşenin Her Anı İçin Ayrı Başlık Oluşturma

Bu adımda, bileşeninizin farklı anları için ayrı başlık oluşturma işlemi açıklanır.

Bileşeninizi sayfaya sürüklediğinizde bileşeninizin büyük başlığında şunun yazdığını göreceksiniz: A_Local_Component. Kullanıcı sayfaya bileşenlerinizin sadece birini sürüklerse bu yeterli olsa da, kullanıcının bileşeninizin farklı anlarını ayırt edebilmesi için ayrı başlıklar oluşturmak isteyebilirsiniz.

Bileşenin başlığını güncellemek için Siteler Yazılım Geliştirme Kitini kullanabilirsiniz. Bu adımda bunu "imageBannerText" niteliğine göre güncelleyeceksiniz.

Başlığı güncellemek için render.js dosyasını düzenleyin ve SampleComponentViewModel nesnenize şu kodu ekleyin:

self.updateDescription = ko.computed(function () {
  SitesSDK.setProperty('description', self.imageBannerText());
});

Bu Knockout hesaplaması, imageBannerText gözlemlenebilir öğesi her değiştiğinde bileşeninizin açıklamasını günceller.

Adım 9'un Sonuçlarını Kontrol Edin

  1. Site Builder'ın bileşendeki değişiklikleri alabilmesi için sitenizde sayfanızı yenileyin.

  2. Sayfayı Düzenleme moduna alın.

  3. Bileşeninizi sayfaya sürükleyin.

  4. Ayarlar panelini bileşeninizin karşısına getirin.

  5. Özel Ayarlar düğmesine tıklayın.

  6. Görüntü Büyük Başlığı'nı Workplace olarak değiştirin.

  7. Ayarlar panelini kapatın ve imlecinizi bileşeninizin üstüne getirip büyük başlığı görüntüleyin.

    Artık A_Local_Component Workplace ifadesinin görüntülendiğini görmelisiniz.

Adım 10: Satır İçi Düzenleme ile İç İçe Yerleştirilmiş Bileşenler Kullanma bölümüne devam edin.