יש לייבא את NavigationMixin מ-Lightning/ניווט בקובץ 'javascript'. ניווט היא השיטה הזמינה במודול זה. זה לוקח את הסוג והתכונות. הסוג מציין את סוג העמוד שאנו מנווטים והתכונות לוקחות את ה-pageName.
- מההגדרה, חפש ב-'Lightning App Builder' ולחץ על 'חדש'.
- בחר את 'דף האפליקציה' ולחץ על 'הבא'.
- תן את התווית בתור 'שירותי ניווט'.
- עבור עם האזור האחד ולחץ על 'סיום'.
האפליקציה שלך מוכנה לשימוש. חפש אותו תחת 'מפעיל האפליקציות'.
עבור כל הדוגמאות של שירות הניווט שעומדות לדון במדריך זה, אנו משתמשים באותו קובץ 'meta-xml'. אתה יכול למקם את הרכיבים בדף האפליקציה שלך שיצרת כעת. לא נציין שוב את הקובץ הזה (meta-xml) תחת קטעי הקוד לדוגמה.
'1.0' ?>
<מטרות>
ניווט לדף הבית
אם ברצונך לנווט אל דף הבית הסטנדרטי של Salesforce, עיין בדוגמה הבאה:
Navigation.html
אנחנו יוצרים כפתור. הלחיצה על 'הביתה ניווט' תטופל בקובץ 'js'.
<תבנית><כרטיס ברק כותרת = 'ניווט ביתי' >
< div מעמד = 'slds-var-m-around_medium' סִגְנוֹן = 'גובה: 20 פיקסלים; רוחב: 400 פיקסלים' >
< ב > אתה תופנה לדף הבית < / ב >< br >< / div >
<כפתור ברק תווית = 'עבור לעמוד הבית' בלחיצה = { בית ניווט } >< / כפתור ברק>
< / ברק-כרטיס>
< / תבנית>
Navigation.js
הסוג צריך להיות 'standard__namedPage' ו-pageName צריך להיות 'home'. זה מצוין בתוך שיטת המטפל homeNavigation().
יְבוּא { LightningElement } מ 'מַזָל' ;
יְבוּא { NavigationMixin } מ 'ברק/ניווט'
יְצוּא בְּרִירַת מֶחדָל מעמד ניווט משתרע NavigationMixin ( LightningElement ) {
// שיטת המטפל
// pageName צריך להיות בית
// סוג הדף הוא standard__namedPage עבור הבית
בית ניווט ( ) {
זֶה [ NavigationMixin. נווט ] ( {
סוּג : 'standard__namedPage' ,
תכונות : {
שם עמוד : 'בית'
}
} )
}
}
תְפוּקָה:
הוסף רכיב זה לדף האפליקציה ולחץ על כפתור 'עבור לדף הבית'.
כעת, אתה בדף הבית.
ניווט אל Chatter
אתה יכול לשתף את הקבצים, הודעות הטקסט ופרטי היומן באמצעות Salesforce Chatter. ניתן לנווט ישירות אל הצ'אטר באמצעות שירות הניווט.
Navigation.html
אנחנו יוצרים כפתור. לחיצה על 'chatterNavigation' זה תטופל בקובץ 'js'.
<תבנית><כרטיס ברק כותרת = 'ניווט פטפוטים' >
< div מעמד = 'slds-var-m-around_medium' סִגְנוֹן = 'גובה: 20 פיקסלים; רוחב: 400 פיקסלים' >
< ב > אתה תופנה אל Chatter < / ב >< br >< / div >
<כפתור ברק תווית = 'לך לצ'אטר' בלחיצה = { chatterNavigation } >< / כפתור ברק>
< / ברק-כרטיס>
< / תבנית>
Navigation.js
הסוג צריך להיות 'standard__namedPage' ו-pageName צריך להיות 'פטפוט'. זה מצוין בתוך שיטת המטפל chatterNavigation(). הדבק את הקטע הבא בתוך המחלקה 'js'.
// שיטת המטפל// pageName צריך להיות פטפוט
// סוג הדף הוא standard__namedPage עבור הפטפוט
chatterNavigation ( ) {
זֶה [ NavigationMixin. נווט ] ( {
סוּג : 'standard__namedPage' ,
תכונות : {
שם עמוד : 'לְפַטְפֵט'
}
} )
}
תְפוּקָה:
רענן את הדף. כעת, אתה יכול לפרסם את העדכונים ולשתף את הקבצים ב-Chatter על ידי ניווט אליו.
ניווט לרשומה חדשה
מבלי לעבור ללשונית האובייקט הספציפית כדי ליצור רשומה חדשה, תוכל ליצור ישירות רשומה חדשה עבור אובייקט ספציפי באמצעות שירות הניווט. בתרחיש זה, עלינו לציין את objectApiName ו-actionName כתכונות.
- ה-objectApiName הוא שם ה-API של אובייקט Salesforce כמו 'חשבון', 'צור קשר', 'מקרה' וכו'.
- אנחנו יוצרים שיא חדש. אז, ה-actionName צריך להיות 'חדש'.
Navigation.html
בואו ניצור רישום מקרה. אנחנו יוצרים כפתור. לחיצה על 'newRecordNavigation' זו תטופל בקובץ 'js'.
<תבנית><כרטיס ברק כותרת = 'ניווט רשומה חדשה' >
< div מעמד = 'slds-var-m-around_medium' סִגְנוֹן = 'גובה: 20 פיקסלים; רוחב: 400 פיקסלים' >
< ב > אתה יכול ליצור מקרה מכאן... < / ב >< br >< / div >
<כפתור ברק תווית = 'צור מקרה' בלחיצה = { newRecordNavigation } >< / כפתור ברק>
< / ברק-כרטיס>
< / תבנית>
Navigation.js
הסוג צריך להיות 'standard__objectPage'. זה מצוין בתוך שיטת המטפל newRecordNavigation() . הדבק את הקטע הבא בתוך המחלקה 'js'.
// שיטת המטפל// מקרה הוא האובייקטApiName ו-actionName הוא חדש.
// סוג הדף הוא standard__objectPage
newRecordNavigation ( ) {
זֶה [ NavigationMixin. נווט ] ( {
סוּג : 'standard__objectPage' ,
תכונות : {
objectApiName : 'מקרה' ,
actionName : 'חָדָשׁ'
}
} )
}
תְפוּקָה:
רענן את הדף. כעת, אתה יכול ליצור רשומה הקשורה למקרה.
אם תשמור אותו, תנווט לדף הרשומות שלו.
ניווט לדף ההקלטה
בדומה לניווט הקודם (דוגמה 3), נוכל לעבור לרשומה הספציפית ולהציג או לערוך את הפרטים. מאפיין אחד נוסף שעליך להעביר בתכונות הוא 'recordId' (מזהה של הרשומה הקיימת). ה-actionName צריך להיות 'תצוגה' בתרחיש זה.
Navigation.html
בואו נעבור לרשומה של התיק. אנחנו יוצרים כפתור. לחיצה על 'viewRecordNavigation' זה תטופל בקובץ 'js'.
<תבנית><כרטיס ברק כותרת = 'הצג ניווט רשומות' >
< div מעמד = 'slds-var-m-around_medium' סִגְנוֹן = 'גובה: 20 פיקסלים; רוחב: 400 פיקסלים' >
< ב > אתה יכול לראות את תיעוד התיק מכאן... < / ב >< br >< / div >
<כפתור ברק תווית = 'נוף' בלחיצה = { viewRecordNavigation } >< / כפתור ברק>
< / ברק-כרטיס>
< / תבנית>
Navigation.js
הסוג צריך להיות 'standard__recordPage'. זה מצוין בתוך שיטת המטפל viewRecordNavigation(). הדבק את הקטע הבא בתוך המחלקה 'js'.
// שיטת המטפל// מקרה הוא האובייקטApiName ו-actionName הוא תצוגה.
// סוג הדף הוא standard__recordPage
viewRecordNavigation ( ) {
זֶה [ NavigationMixin. נווט ] ( {
סוּג : 'רגיל__recordPage' ,
תכונות : {
recordId : '5002t00000PRrXkAAL' ,
objectApiName : 'מקרה' ,
actionName : 'נוף'
}
} )
}
תְפוּקָה:
אתה יכול לראות את פרטי המקרה לאחר הניווט. כאן, תוכל להציג ולערוך את פרטי המקרה.
ניווטים אחרים
בואו ננווט לתצוגת רשימה ולקבצים. עבור תצוגת רשימה, תידרש את שם האובייקט ואת שם המסנן. אתה תמצא את זה בכתובת האתר. נרחיב זאת בדוגמה.
הקבצים מאוחסנים באובייקט ContentDocument. אז, עבור הקבצים, ה-objectApiName יהיה 'ContentDocument' וה-actionName הוא 'home'.
תצוגת רשימה:
קבצים:
Navigation.html
<תבנית><כרטיס ברק כותרת = 'ניווט' >
< div מעמד = 'slds-var-m-around_medium' סִגְנוֹן = 'גובה: 20 פיקסלים; רוחב: 400 פיקסלים' >
< ב > אתה יכול לנווט לתצוגת רשימה < / ב >< br >< / div >
<כפתור ברק תווית = 'עבור לתצוגת רשימה' בלחיצה = { viewListNavigation } >< / כפתור ברק> < br >< br >
< div מעמד = 'slds-var-m-around_medium' סִגְנוֹן = 'גובה: 20 פיקסלים; רוחב: 400 פיקסלים' >
< ב > אתה יכול לנווט אל קבצים < / ב >< br >< / div >
<כפתור ברק תווית = 'עבור לקבצים' בלחיצה = { viewFileNavigation } >< / כפתור ברק>
< / ברק-כרטיס>
< / תבנית>
Navigation.js
// מטפל בתצוגת רשימהviewListNavigation ( ) {
זֶה [ NavigationMixin. נווט ] ( {
סוּג : 'standard__objectPage' ,
תכונות : {
objectApiName : 'מקרה' ,
actionName : 'רשימה' ,
מדינה : {
שם מסנן : '00B2t000002oWELEA2'
}
}
} )
}
// מטפל בתצוגת קבצים
viewFileNavigation ( ) {
זֶה [ NavigationMixin. נווט ] ( {
סוּג : 'standard__objectPage' ,
תכונות : {
objectApiName : 'ContentDocument' ,
actionName : 'בית'
}
} )
}
תְפוּקָה:
תוכל לנווט לתצוגת רשימת התיקים שלך. שם המסנן שציינו הוא 'כל המקרים הסגורים'.
אתה יכול להציג את הקבצים שלך מדף אפליקציה זה על ידי לחיצה על כפתור 'עבור לקבצים'.
סיכום
Salesforce LWC מספק את הניווט הישיר שבו אתה יכול לנווט בשהייה בדף ספציפי. במדריך זה, למדנו את הניווט השונה באמצעות שירות הניווט של Lightning Web Component. ישנם ניווטים רבים אחרים שקיימים אך דנו בניווט החשוב שכל מפתחי LWC חייבים לדעת. בכל הניווטים יש לייבא את ה-NavigationMixin מהברק/ניווט.