function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Luke Higgins 22Luke Higgins 22 

Lightning Web Components passing data to parent component

Hi,

I am trying to show a footer with navigation buttons on this lwc when the "currentStep" attribute reaches 5. This child component gets the number of "currentStep" from the parent. Once the 'Next' button is pressed, I want it to change the number to 6. I can't figure out how to send the change in number of 'currentStep' to the parent component.

shortened version of lwc.html - 

<footer class="slds-modal__footer slds-modal__footer_directional">
     <div if:true={currentStepCheck}>
            <lightning-button  variant="neutral" label="Back" icon-name="utility:back" icon-position="left"  title="Back" onclick={moveBack}>
            </lightning-button>
            <lightning-button variant="brand"  label="Next" icon-name="utility:forward  icon-position="right" title="Next" onclick={moveNext}>
            </lightning-button>
      </div>
</footer>
shortened lwc.js
import { LightningElement, api} from 'lwc';

export default class PtmForWizard extends LightningElement {
    @api recordId;
    @api parentId;
    @api currentStep;

    currentStepCheck(){
        this.currentStep = '5';
    }
    moveNext(){
         this.currentStep = '6';
    }
      moveBack(){
        this.currentStep = '4';
   }
}
shortened parent.cmp
<aura:component  implements="flexipage:availableForRecordHome,force:hasRecordId,flexipage:availableForAllPageTypes,force:lightningQuickAction,force:appHostable" access="global"> 
    <aura:attribute name="recordId" type="Id"/>
    <aura:attribute name="parentId" type="Id"/>
    <aura:attribute name="currentStep" type="String" default="1"/>

    <aura:registerEvent name="recordUpdated" type="c:selectedsObjectRecordsEvent"/>

     <force:recordData aura:id="record"
                      layoutType="FULL"
                      recordId="{!v.recordId}"
                      targetRecord="{!v.record}"
                      targetFields="{!v.efRecord }"
                      mode="VIEW"/>

     <div class="{!v.currentStep == '5' ? 'slds-show' : 'slds-hide'}" >
             <c:ptmForWizard recordId="{!v.efRecord.jstcl__PlacementTeamMember__c}" aura:id="childCmp5" parentId="{!v.recordId}" currentStep="{!v.currentStep}"/>
      </div>
</aura:component>
shortened parent.js