How to Set recordId in LWC Quick Action in Salesforce

🔹 Introduction

Lightning Web Components (LWC) can be used as Quick Actions on Salesforce record pages—making it easy to build forms, modals, and automation.

One of the most common questions developers face is: “How do I get the recordId inside an LWC Quick Action?”

This guide explains the correct pattern using getter/setter.

🎯 Why You Need recordId in Quick Actions

Quick Actions run in the context of the currently opened record. You need the record Id for:

• Sending email related to the record
• Creating related records
• Fetching existing values
• Running Apex logic tied to that record

⚙️ Best Practice: Use Getter/Setter

While you can write @api recordId;, the getter/setter pattern gives you more control.

Benefits:

• Runs logic immediately when recordId arrives
• Prevents repeated calls
• Makes debugging easier

🧾 JavaScript (sendEmailAction.js)

import { LightningElement, api } from 'lwc';

export default class SendEmailAction extends LightningElement {
    _recordId;

    @api
    get recordId() {
        return this._recordId;
    }

    set recordId(value) {
        if (value !== this._recordId) {
            this._recordId = value;
            console.log('Record Id received: ' + this._recordId);

            // You can call your initialization logic here:
            // - fetch record data using Apex
            // - pre-fill UI fields
        }
    }
}

📄 Template (HTML)

<template>
  <lightning-quick-action-panel header="My action">

    Here's some content for the modal body.  
    Record Id: {recordId}

    <div slot="footer">
      <lightning-button variant="neutral" label="Cancel"></lightning-button>
      <lightning-button
        variant="brand"
        label="Save"
        class="slds-m-left_x-small"
      ></lightning-button>
    </div>

  </lightning-quick-action-panel>
</template>

🧩 meta XML — Enable as Screen Quick Action

Use this updated meta XML for the new ScreenAction type:

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

    <targets>
      <target>lightning__RecordAction</target>
    </targets>

    <targetConfigs>
      <targetConfig targets="lightning__RecordAction">
        <actionType>ScreenAction</actionType>
      </targetConfig>
    </targetConfigs>
</LightningComponentBundle>

🛠️ How to Test

1. Deploy the LWC.
2. Go to Object Manager → Buttons, Links & Actions.
3. Create a new Quick Action using your LWC.
4. Add it to the Page Layout.
5. Open a record → Click the Quick Action.

You should see the console log: Record Id received: <Id>

⚠️ Common Mistakes

• Adding LWC to Lightning page instead of a Quick Action
• Missing lightning__RecordAction target
• Not using setter, leading to late initialization

🧾 Conclusion

Using a getter/setter for recordId ensures your Quick Action initializes instantly with the context of the current record. This pattern works for creating related records, sending emails, fetching data, and more.