I am trying to create lwc quick action, which was introduced with the Summer 21 release.
I want to use the recordId property from the object that I am on, but the property is 'undefined' in the connectedCallback.
Code to reproduce the problem:
html:
<template></template>
js:
import {api, LightningElement} from 'lwc';
export default class AccountQuickActionTest extends LightningElement {
@api recordId;
// this does not invoke at all
@api invoke() {
console.log('Hello from invoke:', this.recordId);
}
connectedCallback() {
console.log('recordId:', this.recordId); // prints 'recordId: undefined'
}
}
metadata:
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>51.0</apiVersion>
<isExposed>true</isExposed>
<masterLabel>Account Quick Action</masterLabel>
<targets>
<target>lightning__RecordAction</target>
</targets>
<targetConfigs>
<targetConfig targets="lightning__RecordAction">
<actionType>ScreenAction</actionType>
<objects>
<object>Account</object>
</objects>
</targetConfig>
</targetConfigs>
</LightningComponentBundle>
Anyone has idea, how to resolve this?
Similar post: recordId is undefined in LWC quick action component
-
There is no straight answer. The author suggests obtaining the recordId in the '@api invoke' method, but the @invoke method does not invoke for me, when I click on the action in the record detail.
-
Another valid solution was to add div tag with 'display:none' and get the recordId in the renderedCallback. This works, but I think that it should be possible to get the recordId in a cleaner way.
Best Answer
So according to Salesforce support the component is working as expected (regarding the recordId behavior).
recordId is guaranteed in the connectedCallback() only when you are in specific record context. Even though lightning quick actions are to be used on the record detail pages, the context of the component is not considered as explicit record context and thats why the recordId is not guaranteed in the connectedCallback() function.
Probably best solution how to obtain recordId when the component is opened is to use renderedCallback() and follow the notes in the question's last bullet point.