Introduction

The main concept included in this recipe is using the getRecords adapter to query records from several objects at once: 1 account and 1 contact are used in a single call.

For a full explanation on the parameters, check this page getRecords - Salesforce Lightning Component Library.

<aside> 💡 If you are not familiar with using adapters and the @wiredecorator, review this section Using pre-configured adapters with the @wire decorator and if you are not familiar with invoking Apex from LWC review this Using custom Apex (with the @wire decorator and imperatively).

</aside>

<aside> 📂 Find the LWC in this folder: force-app\\main\\default\\lwc\\wireGetRecordsDifferentTypes

</aside>

Template file

The template shows the value in the property recordStrwhen the property recordResults.data is not empty.

This recordStr property contains the result of execution of the wired commands in the Javascript file.

...
	<div class="slds-var-m-horizontal_medium">
	    <template lwc:if={recordResults.data}>
	        <div class="scroller">
	            <pre>{recordStr}</pre>
	        </div>
	    </template>
	    <template lwc:elseif={recordResults.error}>
	        <c-error-panel errors={recordResults.error}></c-error-panel>
	    </template>
	</div>
	<c-view-source source="lwc/wireGetRecordsDifferentTypes" slot="footer">
	    Get the data of multiple records with different types using @wire
	</c-view-source>
...

Using the same approach, errors are shown when the property recordResults.error has any value and recordResults.datais empty, using the new syntax elseif.

The result shown in the LWC are 2 records (1 contact and 1 account) details:

{
  "results": [
    {
      "statusCode": 200,
      "result": {
        "apiName": "Contact",
        "childRelationships": {},
        "fields": {
          "Name": {
            "displayValue": null,
            "value": "Amy Taylor"
          },
          "Email": {
            "displayValue": null,
            "value": "[email protected]"
          }
        },
        "id": "0030600002AwxBkAAJ",
        "lastModifiedById": "0050600000H6YVYAA3",
        "lastModifiedDate": "2023-07-10T13:07:00.000Z",
        "recordTypeId": "012000000000000AAA",
        "recordTypeInfo": null,
        "systemModstamp": "2023-07-10T13:07:00.000Z"
      }
    },
    {
      "statusCode": 200,
      "result": {
        "apiName": "Account",
        "childRelationships": {},
        "fields": {
          "Name": {
            "displayValue": null,
            "value": "Cuenta de ejemplo para asignaciones"
          }
        },
        "id": "0010600002AjipLAAR",
        "lastModifiedById": "0050600000H6YVeAAN",
        "lastModifiedDate": "2023-07-10T12:12:48.000Z",
        "recordTypeId": "012000000000000AAA",
        "recordTypeInfo": null,
        "systemModstamp": "2023-07-10T12:12:48.000Z"
      }
    }
  ]
}

Javascript file

In the import section, there are 3 different types of modules imported:

//This import is providing the adapter that will be wired to a property
import { getRecords } from 'lightning/uiRecordApi';

//Those 2 imports are statically importing fields from the Contact object
import NAME_FIELD from '@salesforce/schema/Contact.Name';
import EMAIL_FIELD from '@salesforce/schema/Contact.Email';
import ACCOUNT_NAME_FIELD from '@salesforce/schema/Account.Name';

//Those imports bring the exposed Apex functions from the ContactController and AccountController classes
import getContactList from '@salesforce/apex/ContactController.getContactList';
import getAccountList from '@salesforce/apex/AccountController.getAccountList';

Invoking the Apex functions

Getting the account record

The first Apex function exposed belongs to the AccountController class, retrieving 10 Accounts Names and Ids from the backend.

@AuraEnabled(cacheable=true)
public static List<Account> getAccountList() {
    return [SELECT Id, Name FROM Account WITH USER_MODE LIMIT 10];
}

When the Apex function is executed, if there are results returned, the array property accountRecord object is filled, which will be used for the wired adapter getRecords at then of the Javascript.