2

How can we use publish-subscriber event pattern in Community Cloud using lightining web component.

I have drag-and-drop two Lightining Web Component(LWC) in a community page. On click on first component I have to show some output in second component.

Same components are working in Lightning Page(Like: Account detail page) but not in Community page. I used pubsub module from the lwc-receipe for this.

Code which fires the Event:

import { LightningElement, api, wire } from 'lwc';
import {CurrentPageReference} from 'lightning/navigation';
import { fireEvent } from 'c/pubsub'
export default class LwcAccounttile extends LightningElement {
    @api name;
    @wire(CurrentPageReference) pageRef;

    tileClick() {
        fireEvent(this.pageRef, 'inputChangeEvent', this.name);
    }

}

Code which subscribe the events

import { LightningElement,track,api,wire } from 'lwc';
import { CurrentPageReference} from 'lightning/navigation';
import { registerListener, unregisterAllListeners, fireEvent } from 'c/pubsub';

export default class Lwc_AccountEventListner extends LightningElement {
    @track ac;
    @track inpVal;
    @wire(CurrentPageReference) pageRef;

    connectedCallback() {
      // subscribe to inputChangeEvent event
      registerListener('inputChangeEvent', this.handleChange, this);
    }
  disconnectedCallback() {
    // unsubscribe from inputChangeEvent event
    unregisterAllListeners(this);
  }
  handleChange(inpVal) {
    this.inpVal = inpVal;
  }    
}

During debugging I found that this.pageRef is returning undefined in the commnunity while in lightning page it is returning value.

  • 2
    please share you code so we can help working on it – Itai Shmida Feb 28 at 9:49
  • I have added code in the post. please check – Varun Rajpoot Mar 1 at 5:58
2

The pub-sub module checks for page references when firing events, so that the event is scoped and only in the current page.

In Communities, we do support lightning-navigation as of Spring '19: http://releasenotes.docs.salesforce.com/en-us/spring19/release-notes/rn_networks_navigationchanges.htm

However, there are some limitations, currently CurrentPageReference in LWC is not supported like: @wire(CurrentPageReference)currentPageReference;, which is why you are getting undefined page references. We are currently working on supporting it, so it should be out soon!

For a temporary solution, you can just remove all the pageRef checking in pubsub :). Here's a quick example: https://gist.github.com/kmesic/262887799fb70be94707cb0b87936e7b

Also, we are soon going to be releasing a LWC sample that will work in Communities by default! This should help clear up any confusion when using LWC in Communities.

  • Thanks Kenan, This solution worked... – Varun Rajpoot Mar 25 at 7:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.