Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 5

Navigation :

Home , Chatter , New Record, New record with default values, List view, Files, Record Page in view and
Edit Mode, Tab, Record relationship Page, External web page, LWC component, Aura, VF page, fetch
current page reference.

Steps to Use Navigation Service in LWC components – Javascript file.

1) Import {NavigationMixin} from ‘Lightning/navigation’;


2) Export default class class name extends NavigationMixin (Lightningelement)

Home:

Js function (){

// Call NavigationMixin and method Navigate. We have Type and Attributes.

this[NavigationMixin.Navigate]({
type: 'standard__namedPage',
attributes: {
pageName: 'home'
},
});

Chatter:

Js function (){

// Call NavigationMixin and method Navigate. We have Type and Attributes.

this[NavigationMixin.Navigate]({
type: 'standard__namedPage',
attributes: {
pageName: 'chatter'
},
});
}
New record:

import { NavigationMixin } from 'lightning/navigation';


import {encodeDefaultFieldValues} from 'lightning/pageReferenceUtils';

export default class NavToRecordPage extends NavigationMixin(LightningElement) {

recordViewMode(){
this[NavigationMixin.Navigate]({
type: 'standard__recordPage',
attributes: {
recordId:'0035g00000jrRgzAAE',
objectApiName: 'contact',
actionName: 'view'
},
});
}

recordEditMode(){
this[NavigationMixin.Navigate]({
type: 'standard__recordPage',
attributes: {
recordId:'0035g00000jrRgzAAE',
objectApiName: 'contact',
actionName: 'edit'
},
});
}

navToTab(){

this[NavigationMixin.Navigate]({
type: 'standard__navItemPage',
attributes: {
apiName:'Styling_in_LWC'
},
});

}
import { LightningElement } from 'lwc';

import { NavigationMixin } from 'lightning/navigation';


import {encodeDefaultFieldValues} from 'lightning/pageReferenceUtils';
export default class NavToObjectPage extends NavigationMixin(LightningElement) {

navigateAccObject() {
this[NavigationMixin.Navigate]({
type: 'standard__objectPage',
attributes: {
objectApiName: 'Account',
actionName: 'new'
}
});
}

navigateConObjectwithValues() {
// Pass new record object field values.

const defaultValue = encodeDefaultFieldValues({


FirstName:'Zero',
LastName:'Hero',
LeadSource:'Other'
})

this[NavigationMixin.Navigate]({
type: 'standard__objectPage',
attributes: {
objectApiName: 'contact',
actionName: 'new'
},
state:{
defaultFieldValues:defaultValue
}
});
}

navigateToListView(){
this[NavigationMixin.Navigate]({
type: 'standard__objectPage',
attributes: {
objectApiName: 'contact',
actionName: 'list'
},
state:{
filterName:'recent'
}
});

navigateToFiles(){

this[NavigationMixin.Navigate]({
type: 'standard__objectPage',
attributes: {
objectApiName: 'ContentDocument',
actionName: 'home'
}

});
}
}

Relationship:

import { NavigationMixin } from 'lightning/navigation';

export default class NavToRelationshipPage extends


NavigationMixin(LightningElement ){

viewrelationshipRecords(){
this[NavigationMixin.Navigate]({
type: 'standard__recordRelationshipPage',
attributes: {
recordId:'0015g00000wUV7aAAG',
objectApiName:'Account',
relationshipApiName:'Contacts',
actionName:'view'
},
});
External Website:

viewExternalSite()
{
this[NavigationMixin.Navigate]({
type:"standare__webPage",
attributes:{
url:"https://www.google.com"
}

})
}

Navigate to LWC

navigateToLwc(){
var defination={
componentDef:'c:navigationLwcTarget',
attributes: {
recordId:'768766686686'
}
}
this[NavigationMixin.Navigate]({
type:'standard__webPage',
attributes: {
url:'/one/one.app#'+btoa(JSON.stringify(defination))
}
})
}

You might also like