jDeveloper Preview Feature
DID THIS ARTICLE SOLVE YOUR ISSUE?
Let us know so we can improve!
Let us know so we can improve!
NavigationContext
Gets a reference to a Lightning web component’s navigation context (its closest ancestor router container) for use with the generateUrl() and navigate() APIs.
Properties
None
Syntax
1import { LightningElement, wire } from "lwc";
2import { NavigationContext } from "lwr/navigation";
3
4export default class Example extends LightningElement {
5 @wire(NavigationContext)
6 property;
7}Returns
- A
ContextId, which is an opaque ID for the parent router container nearest to the component.
Example
1import { LightningElement, wire } from 'lwc';
2import { NavigationContext, navigate } from 'lwr/navigation';
3
4export default class HomeLink extends LightningElement {
5 // Use the NavigationContext wire to obtain a Context Id value and assign it to the navContext property
6 @wire(NavigationContext)
7 navContext;
8
9 navigateHome(event) {
10 // Navigate when the button is clicked
11 event.preventDefault();
12 // The navigate() API uses the ContextId value
13 if (this.navContext) {
14 navigate(this.navContext, {
15 type: 'home',
16 attributes: { format: 'list' },
17 state: { dark-mode: 'true' },
18 });
19 }
20 }
21}1<template>
2 <button onclick="{navigateHome}">Home</button>
3</template>See Also
j