+ Start a Discussion
Daniel Velez 8Daniel Velez 8 

$recordId in Lightning Web Components

Hello all.

I have this js in a LWC


import { LightningElement, api, wire } from 'lwc';
import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
import SUPERVISOR_FIELD from '@salesforce/schema/Bear__c.Supervisor__c';
const bearFields = [SUPERVISOR_FIELD];
export default class BearSupervisor extends LightningElement {
	@api recordId; // Bear Id
	@wire(getRecord, { recordId: '$recordId', fields: bearFields })
	get supervisorId() {
		return getFieldValue(this.bear.data, SUPERVISOR_FIELD);

how is this code retrieving the recordId? why it is inside single quotes (' '). I know that the "$" makes it reactive. 

Is recordId a special word in salesforce/javascript?

recordId is enver defined in the html

	<lightning-card title="Supervisor" icon-name="standard:people">
		<div class="slds-m-around_medium">
			<!-- Show supervisor when bear is loaded -->
			<template if:true={bear.data}>
			<!-- Data failed to load -->
			<template if:true={bear.error}>
				<div class="slds-text-color_error">
					An error occurred while loading the bear record
this is the configuration file in case you need it 
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="bearSupervisor">
	<targetConfig targets="lightning__RecordPage">

I was looking for documentation about this but I can not fin anything.

I will apreciate any documentation or any comment, I can not understand why this works.

In the wire adapter’s configuration object, prefix a value with $ to reference a property of the component instance. The$ prefix tells the wire service to treat it as a property of the class and evaluate it as this.propertyName. The property is reactive. If the property’s value changes, new data is provisioned and the component rerenders.

You can check mopre details here: https://developer.salesforce.com/docs/component-library/documentation/lwc/data_wire_service_about

Tushar Sharma
https://newstechnologystuff.com/ (https://newstechnologystuff.com)