Callingchildmethodfromparent Html
<template>
<lightning-button variant="base" label="Reset Silder" onclick={handleClick}></lightning-button>
<div class="slds-var-m-bottom_medium">
<c-parenttochildslidercomponent></c-parenttochildslidercomponent>
</div>
</template>
Callingchildmethodfromparent JS
import { LightningElement,api } from 'lwc';
export default class Parenttochild extends LightningElement {
handleClick(){
this.template.querySelector('c-parenttochildslidercomponent').resetslider()
}
}
-------------------------------------------------------------------------------------------------------------------
Parenttochildslidercomponent html
<template>
<lightning-card title="Calling child method from parent" >
<div class="slds-var-m-around_medium">
<lightning-slider label="Volume" value={val} onkeyup={changeHandler}></lightning-slider>
</div>
</lightning-card>
</template>
Parenttochildslidercomponent Js
import { LightningElement,api } from 'lwc';
export default class Parenttochildslidercomponent extends LightningElement {
val = 20
changeHandler(event){
this.val = event.target.value
}
@api resetslider(){
this.val = 30
}
}
No comments:
Post a Comment