HTML Code
Javascript Controller
Output
<template>
    <lightning-card>
    <div class="slds-m-top_medium slds-m-bottom_x-large">
        <h2 class="slds-text-heading_medium slds-m-bottom_medium">
            Simple Button group using lightning buttons.
        </h2>
        <lightning-button-group>
            <lightning-button label="Refresh" onclick={handleButtonGroup}></lightning-button>
            <lightning-button label="Edit" onclick={handleButtonGroup}></lightning-button>
            <lightning-button label="Save" onclick={handleButtonGroup}></lightning-button>
        </lightning-button-group><br/><br/>
        <p>You clicked on <b>{value}</b> button</p>
    </div>
    </lightning-card>
</template>
Javascript Controller
import { LightningElement, track } from 'lwc';
export default class ButtonGroupBasic extends LightningElement {
    @track value;
    handleButtonGroup(event) {
        console.log('label ===> '+event.target.label);
        this.value = event.target.label;
    }
}
Output

No comments:
Post a Comment