Concepts or coding lessons of Salesforce that you can implement easily

Easy Steps to Call Child Method with Parameter's from Parent in LWC

  In this blog, I am explaining how we can call Child method with multiple parameters' from Child component to Parent component in LWC.

parentCmp.html

<template>
    <div>
        <strong>I am from inside Parent</strong>
        <br/>
        <div>
            <lightning-button
                variant="brand"
                label="Change Date"
                title="Change Date"
                onclick={handleDateClick}>
            </lightning-button>
        </div>
    </div>
</template>

parentCmp.js

import { LightningElement } from 'lwc';

export default class ParentCmp extends LightningElement {
    handleDateClick(){
      this.template.querySelector('c-child-cmp').childMethod('From Parent', '42');
    }
}

childCmp.html

<template>
    <strong>I am from inside Child</strong>
    <p>  message - {message} </p>
    <p>  pageno - {pageno}   </p>
    <p>  Date is - {date}   </p>
</template>

childCmp.js

import { LightningElement, api, track } from 'lwc';

export default class ChildCmp extends LightningElement {
    @api message ;
    @api pageno;
    @track date = new Date();

    @api
    childMethod(msgFromParent, pageNumber){
        this.date = new Date();
        this.message = msgFromParent;
        this.pageno = pageNumber;
    }
}

Subscribe blog for More updates !!! 


Read More: WhatsApp on Salesforce Integration in 5 Steps
                    Which Salesforce API Do I Use in Integration?
                    When To Use Salesforce REST API  
                   When To Use Salesforce SOAP API 
                   When To Use Salesforce Bulk API 


Latest Salesforce Interview Questions and Answers:

loading...

No comments:

Post a Comment