lightning-textarea in Salesforce Lightning Web Component

lightning-textarea in Salesforce Lightning Web Component

Sample Code:

HTML:

<template>  
    <lightning-card class="slds-m-around_small">  
        <lightning-textarea
        max-length="100"
        message-when-value-missing="Please enter the description"
        label="Description"
        required
        value={description}
        onchange={handleChange}
        class="textAreaCSS"></lightning-textarea>
    </lightning-card>
</template>

JavaScript:

import { LightningElement } from 'lwc';

export default class DataTable extends LightningElement {
     
    description = 'Default Description';

    handleChange( event ) {

        console.log( 'Updated Value is ' + event.detail.value );
        this.description = event.detail.value;

    }

}

CSS:

.textAreaCSS {
    width: 250px;
}

JS-meta.xml:

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>52.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__Tab</target>
    </targets>
</LightningComponentBundle>

Output:

Leave a Reply