2

Trying to refresh child LWC component from parent Aura component. Here is some of the code I have so far:

Aura Component:

<aura:component implements="flexipage:availableForAllPageTypes,force:hasRecordId,force:hasSObjectName" access="global">
    <aura:handler event="force:refreshView" action="{!c.handleForceRefreshViewForLWC}" />
    <c:childlwccomponent aura:id="childlwccomponent" onlaunchflow="{!c.runFlow}" flowGroup="{!v.flowGroup}" recordId="{!v.recordId}" objectApiName="{!v.sObjectName}"/>
</aura:component>

Aura Controller:

({
handleForceRefreshViewForLWC : function(component, event, helper) {
    component.find("childlwccomponent").forceRefreshInitiated();
},

})

LWC pubsub equivalent:

    const events = {};

const samePageRef = (pageRef1, pageRef2) => {
    const obj1 = pageRef1.attributes;
    const obj2 = pageRef2.attributes;
    return Object.keys(obj1)
        .concat(Object.keys(obj2))
        .every(key => {
            return obj1[key] === obj2[key];
        });
};

/**
 * Fires an event to listeners.
 * @param {object} pageRef - Reference of the page that represents the event scope.
 * @param {string} eventName - Name of the event to fire.
 * @param {*} payload - Payload of the event to fire.
 */
const fireEvent = (pageRef, eventName, payload) => {
    if (events[eventName]) {
        const listeners = events[eventName];
        listeners.forEach(listener => {
            if (samePageRef(pageRef, listener.thisArg.pageRef)) {
                try {
                    listener.callback.call(listener.thisArg, payload);
                } catch (error) {
                    // fail silently
                }
            }
        });
    }
};

export {
    fireEvent
};

LWC component I want to refresh JS:

    import { LightningElement, api, wire, track } from 'lwc';
import { fireEvent } from 'c/pubsub';
import { refreshApex } from '@salesforce/apex';
import getData from '@salesforce/apex/OpportunityDataController.getOppList';

export default class ApexWireMethodToProperty extends LightningElement {
    @api profileGroup;
    @api recordId;
    @api objectApiName;
    @track outputData = [];
    @track error;
    //fireEvent;

    @wire(getOppList, { groupLabel: '$profileGroup', recordId: '$recordId' })
    wiredFlows({ error, data }) {
        if (data) {
            this.error = undefined;
            this.outputData = data;
        } else if (error) {
            this.error = error;
            this.outputData = undefined;
        }
    }

    @api
    forceRefreshInitiated() {
        console.log('---event fired---');
        fireEvent(this.pageRef, 'forceRefresh');
        //eval("$A.get('e.force:refreshView').fire();");
        //$A.get('e.force:refreshView').fire();
        //return refreshApex(this.profileGroup, this.recordId);
    }
}

I get to the console line inside forceRefreshInitiated() but I'm unable to refresh component. Appreciate your help.

  • Are you trying to reset all the variables in the LWC to their default state or are you trying to refire the getOppList wire method? – Calvin OKeefe Feb 18 at 17:48
  • @CalvinOKeefe, trying to refire getOppList – user569925 Feb 18 at 17:53
3

The issue you are having is with how you are saving the response value you get back from the wire method. you are capturing it as a generic object {data,error} however you aren't saving that to a variable external from the wire method. In order to use RefreshApex you have to pass in the response you get back from the wire method like below.

    @track oppResponse;

    @wire(getOppList, { groupLabel: '$profileGroup', recordId: '$recordId' })
                wiredFlows(response) {
                    this.oppResponse = response;
                    let data = response.data;
                    let error = response.error;
                    if (data) {
                        this.error = undefined;
                        this.outputData = data;
                    } else if (error) {
                        this.error = error;
                        this.outputData = undefined;
                    }
                }
     @api forceRefreshInitiated() {
                refreshApex(this.oppResponse);
            }
| improve this answer | |
  • 1
    awesome!!! appreciate your help @Calvin – user569925 Feb 18 at 19:29
  • 1
    No problem, struggled with this one myself – Calvin OKeefe Feb 18 at 19:37

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.