NavigasyonMixin'in Lightning/navigasyondan 'javascript' dosyasına aktarılması gerekir. Gezinme, bu modüldeki mevcut yöntemdir. Tür ve nitelikleri alır. Tür, gezindiğimiz sayfanın türünü belirtir ve nitelikler sayfaAdı'nı alır.
- Kurulumdan “Lightning App Builder”ı arayın ve “Yeni”ye tıklayın.
- “Uygulama Sayfası”nı seçin ve “İleri”ye tıklayın.
- Etiketi “Navigasyon Hizmetleri” olarak verin.
- Bir bölgeye gidin ve “Bitti”ye tıklayın.
Uygulamanız kullanıma hazır. “Uygulama Başlatıcı” altında arayın.
Bu kılavuzda tartışılacak olan tüm Navigasyon Hizmeti örnekleri için aynı “meta-xml” dosyasını kullanıyoruz. Bileşenleri şimdi oluşturduğunuz Uygulama sayfanıza yerleştirebilirsiniz. Bu dosyayı (meta-xml) örnek kod parçacıkları altında tekrar belirtmeyeceğiz.
'1.0' ?>
Ana Sayfaya Gitme
Salesforce standart Ana sayfasına gitmek istiyorsanız aşağıdaki örneğe bakın:
Navigasyon.html
Bir buton oluşturuyoruz. Bu “homeNavigation”a tıklandığında “js” dosyasında işlenecektir.
<şablon>< div sınıf = 'slds-var-m-around_medium' stil = 'yükseklik:20 piksel; genişlik:400 piksel' >
< B > Ana Sayfaya yönlendirileceksiniz < / B >< br >< / div >
< / yıldırım kartı>
< / şablon>
Navigasyon.js
Tür “standart__namedPage” ve sayfaAdı “home” olmalıdır. Bu, homeNavigation() işleyici yönteminin içinde belirtilir.
içe aktarmak { YıldırımElemanı } itibaren 'şans' ;
içe aktarmak { NavigasyonMixin } itibaren 'yıldırım/navigasyon'
ihracat varsayılan sınıf Navigasyon uzanır NavigasyonMixin ( YıldırımElemanı ) {
// işleyici yöntemi
// sayfaAdı ana sayfa olmalıdır
// sayfanın türü ana sayfa için standard__namedPage'dir
anaNavigasyon ( ) {
Bu [ NavigasyonMixin. Gezin ] ( {
tip : 'standart__adlıSayfa' ,
Öznitellikler : {
sayfa ismi : 'Ev'
}
} )
}
}
Çıktı:
Bu bileşeni Uygulama sayfasına ekleyin ve “Ana sayfaya git” düğmesine tıklayın.
Artık Ana sayfadasınız.
Chatter'a gitme
Salesforce Chatter'ı kullanarak dosyaları, kısa mesajları ve günlük ayrıntılarını paylaşabilirsiniz. Navigasyon Hizmetini kullanarak doğrudan Chatter'a gitmek mümkün olabilir.
Navigasyon.html
Bir buton oluşturuyoruz. Bu 'chatterNavigation'a tıklandığında 'js' dosyasında ele alınacaktır.
<şablon>< div sınıf = 'slds-var-m-around_medium' stil = 'yükseklik:20 piksel; genişlik:400 piksel' >
< B > Chatter'a yönlendirileceksiniz < / B >< br >< / div >
< / yıldırım kartı>
< / şablon>
Navigasyon.js
Tür “standart__namedPage” ve sayfaAdı “chatter” olmalıdır. Bu, chatterNavigation() işleyici yönteminin içinde belirtilir. Aşağıdaki pasajı “js” sınıfının içine yapıştırın.
// işleyici yöntemi// sayfaAdı sohbet edici olmalı
// sohbet için sayfanın türü standard__namedPage'dir
sohbetNavigasyon ( ) {
Bu [ NavigasyonMixin. Gezin ] ( {
tip : 'standart__adlıSayfa' ,
Öznitellikler : {
sayfa ismi : 'gevezelik'
}
} )
}
Çıktı:
Sayfayı yenile. Artık Chatter'a giderek güncellemeleri yayınlayabilir ve dosyaları paylaşabilirsiniz.
Yeni Kayda Gitme
Yeni bir kayıt oluşturmak için belirli bir nesne sekmesine gitmeden, Navigasyon Hizmetini kullanarak doğrudan belirli bir nesne için yeni bir kayıt oluşturabilirsiniz. Bu senaryoda, objectApiName ve actionName'i nitelik olarak belirtmemiz gerekir.
- ObjectApiName, 'Hesap', 'İletişim Kişisi', 'Vaka' vb. gibi Salesforce nesne API'sinin adıdır.
- Yeni bir kayıt oluşturuyoruz. Bu nedenle, actionName'in 'yeni' olması gerekir.
Navigasyon.html
Bir Vaka kaydı oluşturalım. Bir buton oluşturuyoruz. Bu 'newRecordNavigation'a tıklandığında 'js' dosyasında işlenecektir.
<şablon>< div sınıf = 'slds-var-m-around_medium' stil = 'yükseklik:20 piksel; genişlik:400 piksel' >
< B > Buradan bir Vaka oluşturabilirsiniz... < / B >< br >< / div >
< / yıldırım kartı>
< / şablon>
Navigasyon.js
Tür “standard__objectPage” olmalıdır. Bu, newRecordNavigation() işleyici yönteminin içinde belirtilir. Aşağıdaki pasajı “js” sınıfının içine yapıştırın.
// işleyici yöntemi// Case, objectApiName'dir ve actionName, New'dir.
// sayfanın türü standard__objectPage
yeniKayıtNavigasyon ( ) {
Bu [ NavigasyonMixin. Gezin ] ( {
tip : 'standart__nesneSayfası' ,
Öznitellikler : {
nesneApiAdı : 'Dava' ,
eylemAdı : 'yeni'
}
} )
}
Çıktı:
Sayfayı yenile. Artık Vakayla ilgili bir kayıt oluşturabilirsiniz.
Kaydederseniz kayıt sayfasına yönlendirileceksiniz.
Kayıt Sayfasına Gitme
Önceki gezinmeye benzer şekilde (Örnek 3), belirli bir kayda gidebilir ve ayrıntıları görüntüleyebilir veya düzenleyebiliriz. Niteliklere aktarmanız gereken bir özellik daha “recordId”dir (mevcut kaydın kimliği). Bu senaryoda actionName 'view' olmalıdır.
Navigasyon.html
Vaka kaydına gidelim. Bir buton oluşturuyoruz. Bu 'viewRecordNavigation'a tıklandığında 'js' dosyasında işlenecektir.
<şablon>< div sınıf = 'slds-var-m-around_medium' stil = 'yükseklik:20 piksel; genişlik:400 piksel' >
< B > Vaka kaydını buradan görüntüleyebilirsiniz... < / B >< br >< / div >
< / yıldırım kartı>
< / şablon>
Navigasyon.js
Tür “standart__recordPage” olmalıdır. Bu, viewRecordNavigation() işleyici yönteminin içinde belirtilir. Aşağıdaki pasajı “js” sınıfının içine yapıştırın.
// işleyici yöntemi// Case, objectApiName'dir ve actionName, view'dır.
// sayfanın türü standart__recordPage
viewRecordNavigation ( ) {
Bu [ NavigasyonMixin. Gezin ] ( {
tip : 'standart__kayıtSayfası' ,
Öznitellikler : {
kayıt kimliği : '5002t00000PRrXkAAL' ,
nesneApiAdı : 'Dava' ,
eylemAdı : 'görüş'
}
} )
}
Çıktı:
Gezinmeden sonra vaka ayrıntılarını görebilirsiniz. Burada vaka ayrıntılarını görüntüleyebilir ve düzenleyebilirsiniz.
Diğer Gezinmeler
Liste görünümüne ve dosyalara gidelim. Liste görünümü için nesne adına ve filterName'e ihtiyacınız olacaktır. Bunu URL'de bulacaksınız. Bunu örnekte detaylandıracağız.
Dosyalar ContentDocument nesnesinde saklanır. Yani dosyalar için objectApiName, “ContentDocument” ve actionName, “home” olacaktır.
Liste görünümü:
Dosyalar:
Navigasyon.html
<şablon>< div sınıf = 'slds-var-m-around_medium' stil = 'yükseklik:20 piksel; genişlik:400 piksel' >
< B > Liste Görünümüne gidebilirsiniz < / B >< br >< / div >
< div sınıf = 'slds-var-m-around_medium' stil = 'yükseklik:20 piksel; genişlik:400 piksel' >
< B > Dosyalar'a gidebilirsiniz < / B >< br >< / div >
< / yıldırım kartı>
< / şablon>
Navigasyon.js
// Liste görünümü işleyicisigörünümListesiNavigasyon ( ) {
Bu [ NavigasyonMixin. Gezin ] ( {
tip : 'standart__nesneSayfası' ,
Öznitellikler : {
nesneApiAdı : 'Dava' ,
eylemAdı : 'liste' ,
durum : {
filtreAdı : '00B2t000002oWELEA2'
}
}
} )
}
// Dosya görünümü işleyicisi
viewFileNavigation ( ) {
Bu [ NavigasyonMixin. Gezin ] ( {
tip : 'standart__nesneSayfası' ,
Öznitellikler : {
nesneApiAdı : 'İçerikBelgesi' ,
eylemAdı : 'Ev'
}
} )
}
Çıktı:
Vaka listesi görünümüne gideceksiniz. Belirttiğimiz filterName “Tüm Kapalı Vakalar”dır.
Dosyalarınızı bu Uygulama sayfasından “Dosyalara Git” düğmesini tıklayarak görüntüleyebilirsiniz.
Çözüm
Salesforce LWC, belirli bir sayfada kalarak gezinebileceğiniz doğrudan gezinme sağlar. Bu kılavuzda Lightning Web Bileşeni Gezinme Hizmetini kullanarak farklı gezinmeyi öğrendik. Daha pek çok gezinme mevcut ancak tüm LWC Geliştiricilerinin bilmesi gereken önemli gezinmeyi tartıştık. Tüm navigasyonlarda, Lightning/navigasyondan NavigasyonMixin'in içe aktarılması gerekir.