LWC API Reference

lightning/uiListApi

Purpose: Query and access lists of records

Wire Adapters

getListUi(objectApiName, listViewApiName)

Signature: @wire(getListUi, { objectApiName: objectApiName, listViewApiName: listViewApiName })

Parameters:

Returns: { data, error }: Object with list data or error

Description: Retrieves list view data for an object.

Example:

import { getListUi } from 'lightning/uiListApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';

@wire(getListUi, {
    objectApiName: ACCOUNT_OBJECT,
    listViewApiName: 'AllAccounts'
})
wiredAccounts({ data, error }) {
    if (data) {
        this.accounts = data.records.records;
    }
}

Related Patterns: LDS Patterns


Lightning Message Service

lightning/messageService

Purpose: Cross-component communication without parent-child relationship

Methods

publish(messageContext, messageChannel, messagePayload)

Signature: publish(messageContext, messageChannel, messagePayload)

Parameters:

Returns: void

Description: Publishes a message to subscribers on the message channel.

Example:

import { publish, MessageContext } from 'lightning/messageService';
import CHANNEL_NAME from '@salesforce/messageChannel/MyChannel__c';

@wire(MessageContext)
messageContext;

handlePublish() {
    const payload = { recordId: this.recordId, action: 'update' };
    publish(this.messageContext, CHANNEL_NAME, payload);
}
subscribe(messageContext, messageChannel, listener, subscriberOptions)

Signature: subscribe(messageContext, messageChannel, listener, subscriberOptions)

Parameters:

Returns: Subscription (object to unsubscribe)

Description: Subscribes to messages on a message channel. Must be called in connectedCallback().

Example:

import { subscribe, MessageContext, APPLICATION_SCOPE } from 'lightning/messageService';
import CHANNEL_NAME from '@salesforce/messageChannel/MyChannel__c';

@wire(MessageContext)
messageContext;

connectedCallback() {
    this.subscription = subscribe(
        this.messageContext,
        CHANNEL_NAME,
        (message) => this.handleMessage(message),
        { scope: APPLICATION_SCOPE }
    );
}

disconnectedCallback() {
    if (this.subscription) {
        unsubscribe(this.subscription);
    }
}

Related Patterns: LWC Best Practices


Schema Imports

@salesforce/schema

Purpose: Import object and field references for referential integrity

Usage

Import Object:

import ACCOUNT_OBJECT from '@salesforce/schema/Account';

Import Field:

import NAME_FIELD from '@salesforce/schema/Account.Name';
import EMAIL_FIELD from '@salesforce/schema/Contact.Email';

Example:

import { LightningElement, wire, api } from 'lwc';
import { getRecord } from 'lightning/uiRecordApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import NAME_FIELD from '@salesforce/schema/Account.Name';

export default class AccountViewer extends LightningElement {
    @api recordId;
    
    @wire(getRecord, {
        recordId: '$recordId',
        fields: [NAME_FIELD]
    })
    wiredAccount;
}

Related Patterns: LDS Patterns, Referential Integrity


Decorators

@api

Purpose: Expose public properties and methods for external access

Usage:

import { LightningElement, api } from 'lwc';

export default class MyComponent extends LightningElement {
    @api recordId;
    @api title;
    
    @api
    get computedValue() {
        return this.recordId + ' - ' + this.title;
    }
    
    @api
    handleAction() {
        // Public method
    }
}

Best Practices:

Related Patterns: LWC Best Practices


@wire

Purpose: Reactive data access from Lightning Data Service or Apex

Usage:

import { LightningElement, wire, api } from 'lwc';
import { getRecord } from 'lightning/uiRecordApi';
import getContactData from '@salesforce/apex/ContactService.getContactData';

export default class MyComponent extends LightningElement {
    @api recordId;
    
    // Wire to LDS
    @wire(getRecord, { recordId: '$recordId' })
    wiredRecord;
    
    // Wire to Apex
    @wire(getContactData, { contactId: '$recordId' })
    wiredContactData({ data, error }) {
        if (data) {
            this.contact = data;
        } else if (error) {
            this.error = error;
        }
    }
}

Best Practices:

Related Patterns: LWC Patterns


@track

Purpose: Track changes to object/array properties (not needed for primitives)

Usage:

import { LightningElement, track } from 'lwc';

export default class MyComponent extends LightningElement {
    // Not needed for primitives
    message = 'Hello';
    
    // Needed when mutating nested properties
    @track complexObject = {
        nested: { value: 0 }
    };
    
    handleClick() {
        // This mutation requires @track
        this.complexObject.nested.value++;
    }
}

Best Practices:

Related Patterns: LWC Patterns - Complete LWC patterns