LWC List View Button Examples

Scenario

Expose an LWC as a list-view action that processes selected records in bulk.

Example 1: Read Selected IDs from Page State

import { LightningElement, wire } from 'lwc';
import { CurrentPageReference } from 'lightning/navigation';

export default class ListViewActionExample extends LightningElement {
    selectedRecordIds = [];

    @wire(CurrentPageReference)
    getStateParameters(currentPageReference) {
        const selected = currentPageReference?.state?.selectedIds;
        this.selectedRecordIds = selected ? selected.split(',') : [];
    }
}

Example 2: Invoke Bulk Apex Action

import { LightningElement, wire } from 'lwc';
import { CurrentPageReference } from 'lightning/navigation';
import runBulkAction from '@salesforce/apex/ListViewActionController.runBulkAction';

export default class ListViewActionExample extends LightningElement {
    selectedRecordIds = [];

    @wire(CurrentPageReference)
    getStateParameters(currentPageReference) {
        const selected = currentPageReference?.state?.selectedIds;
        this.selectedRecordIds = selected ? selected.split(',') : [];
    }

    async handleRun() {
        if (!this.selectedRecordIds.length) return;
        await runBulkAction({ recordIds: this.selectedRecordIds });
    }
}

public with sharing class ListViewActionController {
    @AuraEnabled
    public static void runBulkAction(List<Id> recordIds) {
        if (recordIds == null || recordIds.isEmpty()) return;

        List<Case> rows = [
            SELECT Id, Status
            FROM Case
            WHERE Id IN :recordIds
        ];

        for (Case c : rows) {
            c.Status = 'Working';
        }
        update rows;
    }
}

Example 3: Metadata Exposure

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

Guardrails