Skip to main content
This component demonstrates how to wire an Apex method to a component property. The data is automatically retrieved when the component loads and updates reactively.

​
Implementation

import { LightningElement, wire } from 'lwc';
import getContactList from '@salesforce/apex/ContactController.getContactList';

export default class ApexWireMethodToProperty extends LightningElement {
    @wire(getContactList) contacts;
}

​
Key Features

​
Wire to Property

The @wire decorator binds the Apex method directly to the contacts property: 
@wire(getContactList) contacts;
The property automatically receives an object with data and error properties.

​
Accessing Data

Access the returned data through contacts.data: 
<template lwc:if={contacts.data}>
    <template for:each={contacts.data} for:item="contact">
        <p key={contact.Id}>{contact.Name}</p>
    </template>
</template>

​
Error Handling

Handle errors through contacts.error: 
<template lwc:elseif={contacts.error}>
    <c-error-panel errors={contacts.error}></c-error-panel>
</template>

​
Apex Method Requirements

  • Must be annotated with @AuraEnabled(cacheable=true)
  • Must be static
  • Must use with sharing for security
  • Should include WITH USER_MODE in SOQL queries for proper security enforcement

​
When to Use

Use this pattern when:
  • You need automatic data loading when component initializes
  • The Apex method has no parameters
  • You want automatic reactive updates
  • You need simple access to data and error states

Build docs developers (and LLMs) love

Get started for freeTalk to us