How to get pageReference on target Aura cmp init when being called from a different Aura cmp in a Community?

Question

I've been stuck on this for a solid day now. I have a large package that need to deploy which uses 3 Aura components. They navigate to each other at various times using navigateToComponent. When I moved the component into the Community the function doesn't work.

From what I've read, we have to use lightning:isUrlAddressable, navService, pageReference, and sessionStorage (if passing parameters, which I am).

I have test components I'm using for this and am managing to pass a string parameter into the target Aura component, which is good, but I have no idea how to retrieve it from the URL in the target component. From what I've looked at online, v.pageReference should be available if I am implementing lightning:isUrlAddressable, which I am. See below and let me know your thoughts.

Please note that when I debug this it is stopping at myPageRef on the target component because pageReference is null. I've tried creating this attribute in the target componet but it doesn't fix this. I need to better understand how to get the v.pageReference on the target component.

Edit 1: I removed flexipage from both components. This did NOT fix the problem.

The Aura component that is being used to launch the second via a button.

<aura:component implements="lightning:isUrlAddressable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes" 
                access="global" >

    <lightning:navigation aura:id="navService"/>
    <aura:attribute name="pageReference" type="Object" />
    <lightning:button label="Click Me" onclick="{!c.click}"/> 

</aura:component>

The Controller js that is being used to launch the second.

({
    click : function(component, event, helper) {

        event.preventDefault();
        var navService = component.find("navService");
        var pageReference = {
            type: 'comm__namedPage',
            attributes: {
                pageName: "ltest2"  
            },
            state: {
                c__firstname: 'paul'
            }
        }
        sessionStorage.setItem('pageTransfer', JSON.stringify(pageReference.state));
        navService.navigate(pageReference);

    }
})

The target component we are launching and passing value into firstname.

<aura:component implements="lightning:isUrlAddressable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes" 
                access="global" >

    <aura:attribute name="firstname" type="String" default="not working" />
    <aura:handler name="init" value="{!this}" action="{!c.onPageReferenceChange}"/>
    <aura:handler name="change" value="{!v.pageReference}" action="{!c.onPageReferenceChange}"/>

    Name: {!v.firstName}

</aura:component>

The Controller js which is meant to set v.firstname.

({
    onPageReferenceChange: function(component, event, helper) {
        var myPageRef = component.get("v.pageReference");
        var firstname = myPageRef.state.c__firstname;
        component.set("v.firstname", firstname);
    }
})

I want reiterate this point next to the code: Please note that when I debug this it is stopping at myPageRef on the target component because pageReference is null. I've tried creating this attribute in the target componet but it doesn't fix this. I need to better understand how to get the v.pageReference on the target component.

Thanks in advance!!!

I wanted to add that I found in the link below that lightning:isUrlAddressable should accept pageReference. For whatever reason, mine does not... https://developer.salesforce.com/docs/component-library/bundle/lightning:hasPageReference/documentation — paulK, Apr 23 '20 at 01:09
it seems you are going to community page not to any component is the component on community page? — User6670, Apr 23 '20 at 05:07
I originally tried to go to a component. This works in Salesforce but not in a Community. From my understanding, you need to have a Community page with the other component and then use comm__namedPage for pageReference type to get it in there. All this works and I can see my value in the URL in the new target page url. But again, the component doesn't grab the value... — paulK, Apr 23 '20 at 14:47
https://salesforce.stackexchange.com/questions/270772/getting-pagereference-is-not-working-in-community did you try this — User6670, Apr 23 '20 at 15:35
OMG that was it! Muah muah muah! I wasn't using sessionStorage.getItem() on the target controller js. If you add the answer below I'll select as best answer. THANK YOU! — paulK, Apr 23 '20 at 16:21

score 1 · Accepted Answer · answered Apr 23 '20 at 16:36

You can the value from session variable like this

var localStuff = sessionStorage.getItem('pageTransfer');
if (localStuff) {
    var state = JSON.parse(localStuff);
    // Do the needed stuff here
}

as also answered here getting PageReference is not working in community

How to get pageReference on target Aura cmp init when being called from a different Aura cmp in a Community?

1 Answers1