LWC – Navigačná služba

Lwc Navigacna Sluzba



Viete, že LWC poskytuje spôsob, ako prejsť priamo z existujúcej stránky na Home, Files, Record, Aura, VF page, Chatter, List a Tab? Odpoveď je áno. Túto funkcionalitu dosiahneme pomocou konceptu navigačnej služby. V tejto príručke si tieto navigácie s príkladmi podrobne rozoberieme. Predtým musíte mať stránku aplikácie, aby ste mohli pridať svoje komponenty LWC, o ktorých hovoríme v tejto príručke. Môžete sa v ňom pohybovať z tejto stránky aplikácie.

NavigationMixin je potrebné importovať z blesku/navigácie v súbore „javascript“. Navigácia je dostupná metóda v tomto module. Vyžaduje typ a atribúty. Typ určuje typ stránky, na ktorej sa pohybujeme, a atribúty majú názov stránky.

  1. V nastavení vyhľadajte „Lightning App Builder“ a kliknite na „Nový“.
  2. Vyberte „Stránka aplikácie“ a kliknite na „Ďalej“.
  3. Označte ako „Navigačné služby“.
  4. Prejdite do jednej oblasti a kliknite na „Hotovo“.

Vaša aplikácia je pripravená na použitie. Vyhľadajte ho v časti „Spúšťač aplikácií“.









Pre všetky príklady navigačnej služby, o ktorých sa bude diskutovať v tejto príručke, používame rovnaký súbor „meta-xml“. Komponenty môžete umiestniť na stránku aplikácie, ktorú ste teraz vytvorili. Tento súbor (meta-xml) nebudeme znova špecifikovať pod ukážkovými úryvkami kódu.



'1,0' ?>

'http://soap.sforce.com/2006/04/metadata' >

57,0

pravda



lightning__AppPage



Prechod na domovskú stránku

Ak chcete prejsť na štandardnú domovskú stránku Salesforce, pozrite si nasledujúci príklad:





Navigation.html

Vytvárame tlačidlo. Kliknutím na túto „homeNavigation“ sa spracuje súbor „js“.

<šablóna>

titul = 'Navigácia domov' >

< div trieda = 'slds-var-m-around_medium' štýl = 'výška:20px; šírka:400px' >

< b > Budete presmerovaní na domovskú stránku < / b < br < / div >

štítok = 'Prejdi na domovskú stránku' po kliknutí = { domovNavigácia } < / blesk-tlačidlo>

< / blesková karta>

< / šablóna>

Navigation.js

Typ by mal byť „standard__namedPage“ a názov stránky by mal byť „home“. Toto je špecifikované v metóde obslužného programu homeNavigation().



importovať { LightningElement } od 'šťastie' ;

importovať { NavigationMixin } od „blesk/navigácia“

export predvolená trieda Navigácia predlžuje NavigationMixin ( LightningElement ) {

// metóda manipulátora

// názov stránky by mal byť domov

// typ stránky je standard__namedPage pre domovskú stránku

domovNavigácia ( ) {

toto [ NavigationMixin. Navigovať ] ( {

typu : 'standard__namedPage' ,

atribúty : {

názov stránky : 'Domov'

}

} )

}

}

Výkon:

Pridajte tento komponent na stránku aplikácie a kliknite na tlačidlo „Prejsť na domovskú stránku“.

Teraz ste na domovskej stránke.

Navigácia na Chatter

Pomocou aplikácie Salesforce Chatter môžete zdieľať súbory, textové správy a podrobnosti denníka. Je možné navigovať na Chatter priamo pomocou navigačnej služby.

Navigation.html

Vytvárame tlačidlo. Kliknutím na túto „chatterNavigation“ sa spracuje súbor „js“.

<šablóna>

titul = 'Navigácia chatovania' >

< div trieda = 'slds-var-m-around_medium' štýl = 'výška:20px; šírka:400px' >

< b > Budete presmerovaní na Chatter < / b < br < / div >

štítok = 'Choď na Chatter' po kliknutí = { chatterNavigácia } < / blesk-tlačidlo>

< / blesková karta>

< / šablóna>

Navigation.js

Typ by mal byť „standard__namedPage“ a názov stránky by mal byť „chatter“. Toto je špecifikované v metóde obsluhy chatterNavigation(). Vložte nasledujúci úryvok do triedy „js“.

// metóda manipulátora

// názov stránky by mal byť chatter

// typ stránky je standard__namedPage pre chatovanie

chatterNavigácia ( ) {

toto [ NavigationMixin. Navigovať ] ( {

typu : 'standard__namedPage' ,

atribúty : {

názov stránky : 'klábosiť'

}

} )

}

Výkon:

Obnovte stránku. Teraz môžete uverejňovať aktualizácie a zdieľať súbory v aplikácii Chatter tak, že do nej prejdete.

Prechod na Nový záznam

Bez toho, aby ste museli prejsť na záložku konkrétneho objektu na vytvorenie nového záznamu, môžete priamo vytvoriť nový záznam pre konkrétny objekt pomocou navigačnej služby. V tomto scenári musíme špecifikovať objectApiName a actionName ako atribúty.

  1. ObjectApiName je názov API objektu Salesforce, ako napríklad „Účet“, „Kontakt“, „Prípad“ atď.
  2. Vytvárame nový záznam. Takže názov akcie by mal byť „nový“.

Navigation.html

Vytvorme záznam o prípade. Vytvárame tlačidlo. Kliknutím na túto „newRecordNavigation“ sa spracuje súbor „js“.

<šablóna>

titul = 'Nová navigácia podľa záznamu' >

< div trieda = 'slds-var-m-around_medium' štýl = 'výška:20px; šírka:400px' >

< b > Tu môžete vytvoriť prípad... < / b < br < / div >

štítok = 'Vytvoriť prípad' po kliknutí = { newRecordNavigation } < / blesk-tlačidlo>

< / blesková karta>

< / šablóna>

Navigation.js

Typ by mal byť „standard__objectPage“. Toto je špecifikované v metóde obsluhy newRecordNavigation(). Vložte nasledujúci úryvok do triedy „js“.

// metóda manipulátora

// Case je objectApiName a actionName je New.

// typ stránky je standard__objectPage

newRecordNavigation ( ) {

toto [ NavigationMixin. Navigovať ] ( {

typu : 'standard__objectPage' ,

atribúty : {

objectApiName : 'prípad' ,

actionName : 'Nový'

}

} )

}

Výkon:

Obnovte stránku. Teraz môžete vytvoriť záznam súvisiaci s Prípadom.

Ak ho uložíte, prejdete na jeho záznamovú stránku.

Prechod na záznamovú stránku

Podobne ako v predchádzajúcej navigácii (príklad 3) môžeme prejsť na konkrétny záznam a zobraziť alebo upraviť podrobnosti. Ďalšou vlastnosťou, ktorú musíte zadať do atribútov, je „recordId“ (ID existujúceho záznamu). ActionName by mal byť v tomto scenári „zobraziť“.

Navigation.html

Prejdime k záznamu prípadu. Vytvárame tlačidlo. Kliknutím na tento „viewRecordNavigation“ sa spracuje súbor „js“.

<šablóna>

titul = 'Zobraziť navigáciu záznamov' >

< div trieda = 'slds-var-m-around_medium' štýl = 'výška:20px; šírka:400px' >

< b > Záznam prípadu si môžete pozrieť tu... < / b < br < / div >

štítok = 'Výhľad' po kliknutí = { viewRecordNavigation } < / blesk-tlačidlo>

< / blesková karta>

< / šablóna>

Navigation.js

Typ by mal byť „standard__recordPage“. Toto je špecifikované v metóde obsluhy viewRecordNavigation(). Vložte nasledujúci úryvok do triedy „js“.

// metóda manipulátora

// Case je objektApiName a actionName je zobrazenie.

// typ stránky je standard__recordPage

viewRecordNavigation ( ) {

toto [ NavigationMixin. Navigovať ] ( {

typu : 'standard__recordPage' ,

atribúty : {

recordId : '5002t00000PRrXkAAL' ,

objectApiName : 'prípad' ,

actionName : 'vyhliadka'

}

} )

}

Výkon:

Podrobnosti prípadu môžete vidieť po navigácii. Tu môžete zobraziť a upraviť podrobnosti prípadu.

Iné navigácie

Prejdime do zobrazenia zoznamu a súborov. Pre zobrazenie zoznamu budete vyžadovať názov objektu a filterName. Nájdete to v URL adrese. Vysvetlíme to na príklade.

Súbory sú uložené v objekte ContentDocument. Takže pre súbory bude objectApiName „ContentDocument“ a actionName bude „home“.

Zoznam:

Súbory:

Navigation.html

<šablóna>

titul = 'navigačný' >

< div trieda = 'slds-var-m-around_medium' štýl = 'výška:20px; šírka:400px' >

< b > Môžete prejsť do zobrazenia zoznamu < / b < br < / div >

štítok = 'Prejsť na zobrazenie zoznamu' po kliknutí = { viewListNavigation } < / blesk-tlačidlo> < br < br >

< div trieda = 'slds-var-m-around_medium' štýl = 'výška:20px; šírka:400px' >

< b > Môžete prejsť na Súbory < / b < br < / div >

štítok = 'Prejsť na súbory' po kliknutí = { viewFileNavigation } < / blesk-tlačidlo>



< / blesková karta>

< / šablóna>

Navigation.js

// Obslužný program Listview

viewListNavigation ( ) {

toto [ NavigationMixin. Navigovať ] ( {

typu : 'standard__objectPage' ,

atribúty : {

objectApiName : 'prípad' ,

actionName : 'zoznam' ,

štát : {

filterName : '00B2t000002oWELEA2'

}

}

} )

}

// Obslužný program Filesview

viewFileNavigation ( ) {

toto [ NavigationMixin. Navigovať ] ( {

typu : 'standard__objectPage' ,

atribúty : {

objectApiName : 'ContentDocument' ,

actionName : 'Domov'

}

} )

}

Výkon:

Prejdete do zobrazenia zoznamu prípadov. Názov filtra, ktorý sme zadali, je „Všetky uzavreté prípady“.

Svoje súbory môžete zobraziť na tejto stránke aplikácie kliknutím na tlačidlo „Prejsť na súbory“.

Záver

Salesforce LWC poskytuje priamu navigáciu, v ktorej sa môžete pohybovať pri pobyte na konkrétnej stránke. V tejto príručke sme sa naučili rôzne navigácie pomocou služby Lightning Web Component Navigation Service. Existuje mnoho ďalších navigácií, ale diskutovali sme o dôležitej navigácii, ktorú musia poznať všetci vývojári LWC. Vo všetkých navigáciách musí byť NavigationMixin importovaný z blesku/navigácie.